jquery.validate.remote 的一个bug

最新推荐文章于 2024-12-25 22:03:18 发布

原创最新推荐文章于 2024-12-25 22:03:18 发布 · 243 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jQuery #json #Ajax #框架 #ViewUI

本文介绍了一个关于jQuery验证插件1.7版本中远程验证功能存在的Bug及其解决方案。当用户首次登录失败并更新验证码时，若直接点击登录而非使用Tab键切换，会导致界面闪烁且无法立即提交。该文详细解释了此问题的原因在于异步提交的延迟，并提供了通过修改代码将异步提交改为同步提交的方法来解决这一问题。

version :jQuery validation plug-in 1.7
remote bug的大致情况。以普通的登录流程为例

1.相关代码 ：

$("#form").validate({
        rules: {
            loginId:"required" ,
            password:"required" ,
            code:{
                remote: {
                    url:  "/verification-code!check.action",     //后台处理程序
                    type: "post",               //数据发送方式
                    dataType: "json"                   
                }
            }
        },  ......

2.bug的形成情景 ：
如果第一次登录失败，仍返回到login页面，系统会自动切换验证码。此时输入正确的验证码后，不用键盘的“tab”切换，直接点击【login】按钮，此时界面会闪一下，并不提交，再按一次才会提交。

3.分析
remote采用的是异步提交，也就是不管最后的结果是true 还是false，都有一定的响应延迟，但是程序程序早已经往下执行了。validation框架就认为verification code的验证结果为false。不提交。

4.解决
修改代码，将异步提交改成同步提交。比如：

$.ajax($.extend(true, {
					url: param,
					mode: &quot;abort&quot;,
					port: &quot;validate&quot; + element.name,
					dataType: &quot;json&quot;,
					data: data,
                    async: false,   

    //同步加载 不加会有bug