-2

我已经研究了好几个小时了,而且我束手无策。我在同一页面上有两个表单,它们都使用 jQuery 验证在提交之前确认有效数据。

编辑:

包括下面的代码。

两件事情:

  1. 出于某种原因,正在验证第一个表格(注册表),因为我正在输入数据。因此,它似乎在 keyup/blur 事件上触发,但是当我单击提交按钮时没有正确触发。如您所见,它允许使用空或无效数据提交表单。

  2. 右侧的登录表单。有用!但我需要单击提交按钮两次才能实际提交表单。

这里满是头发。拜托,有人能帮忙解决这个问题吗?

编辑:

根据要求在此处添加代码。一、注册验证器:

<script type="text/javascript">

$(document).ready(function() {
    
 $.validator.addMethod("PASSWORD",function(value,element){
        return this.optional(element) || /^(?=.*\d)(?=.*[a-zA-Z]).{5,}$/i.test(value);
        },"Your password must be at least 5 characters long. Please include 1 or more numbers.");
  $.validator.addMethod("lettersnumbers", function(value,element) {
        return this.optional(element) || /^[a-zA-Z0-9]+$/i.test(value);
        }, "Username can only contain letters and numbers. No spaces are allowed.");    
 $.validator.addMethod("BIRTH",function(value,element){
        var age = 18;
                
        switch($('#Province option:selected').val())
        {
            case "NB":
            case "BC":
            case "NL":
            case "NS":
            case "NY":
            case "YT":
            case "NU":
            case "AL":
            case "DE":
            case "NE":
            case "NV":
            case "OH":
            case "TN":
            case "UT":
            case "VA":
            case "WI":
                age = 19;
                break;
            case "MS":
                age = 21;
                break;      
                            
        }
        if (new Date().getFullYear() - year <= age)
        {                                   
            return false;           
        }
        return true;
        },"In order to be eligible to Register, you must have reached the age of majority in your Province, Territory, or County of residence.");
 var validator = $("#signupForm").validate({
        rules: {
            Captcha: {
                required: true,
                remote: {
                    url: "/js/validate_captcha.php",
                    type: "post",
                    data: {
                        action: function () {
                            return "checkcaptcha";
                        },
                        username: function() {
                            var Captcha = $("#Captcha").val();
                            return Captcha;
                        }
                    }
                }               
            },          
            Password: "required PASSWORD",
            PasswordConfirm: {
                required: true,
                minlength: 5,
                equalTo: "#Password"
            },
            Username: {
                required: true,
                lettersnumbers: true,
                maxlength: 18,
                remote: {
                    url: "/js/validate_username.php",
                    type: "post",
                    data: {
                        action: function () {
                            return "checkusername";
                        },
                        username: function() {
                            var Username = $("#Username").val();
                            return Username;
                        }
                    }
                }

            },
            Country: "required",
            FirstName: "required",
            LastName: "required",
            Email: {
                required: true,
                remote: {
                    url: "/js/validate_email.php",
                    type: "post",
                    data: {
                        action: function () {
                            return "checkemail";
                        },
                        username: function() {
                            var Email = $("#Email").val();
                            return Email;
                        }
                    }
                },
                email: true
            },
            EmailConfirm: {
                required: true,
                email: true,
                equalTo: "#Email"
            },
            BirthDate: { 
                required: true,
                BIRTH: true
            },
            Agreement: "required",
            AgeCheck: "required",

        },
        messages: {
            captcha: "CAPTCHA response is required" ,
            Agreement: "You must agree by checking the box" ,
            AgeCheck: "You must agree by checking the box"  ,       
            EmailConfirm: "Email Addresses do not Match",
            lettersnumbers: "Username can only contain letters and numbers. No spaces allowed.",
            noSpace: "Username cannot have spaces",
            PasswordConfirm: "Please re-enter the same password as above",  
            Username:{
                remote: "This username is already taken. Try another.",
                maxlength: "Username may not be longer than 18 characters."
            },
            Captcha:{
                remote: "You have entered an incorrect CAPTCHA response."
            },              
            Email:{
                remote: "This e-mail is already taken. Try another."
            },          
            Password: {
                required: "Please provide a password",
                minlength: "Your password must be at least 5 characters long. Please include 1 or more numbers."            },
            required: "Required Field" ,
        },
    }); 

});

</script>            

现在,登录验证器:

<script type="text/javascript">
$(document).ready(function() {
 
   var loginvalidator = $("#form_login").validate({
      rules: {
          LoginUser: {
              required: true,
              remote: {
                  url: "/js/validate_login_username.php",
                  type: "post",
                  data: {
                      action: function () {
                          return "checkusername";
                      },
                      username: function() {
                          var Email = $("#LoginUser").val();
                          return Email;
                      }
                  }
              }             
          },    
        
          LoginPassword: "required"
        
      },
      messages: {               
          LoginUser: {
              required: "Required Field",
              remote: "The username or email entered was not found. Please note, your username must contain only letters and numbers, and never any spaces. Try logging in with your email address instead." },
          LoginPassword: {
              required: "Required Field",
              remote: "Password is incorrect. Please try again." },
      },
   });  
});
</script>
4

1 回答 1

0

[以下答案已根据评论进行编辑]

因为没有什么特别的错误从代码中跳出来:

  • 尝试在每个验证器中启用调试选项 {debug:true} 以获得一些输出到控制台以发现问题。

  • 您没有明确说明要验证哪些事件,请考虑将 {onkeydown:false, onfocusout:false, onclick:false} 添加到选项哈希中,以便将验证限制为仅提交事件。

  • 在右括号后的规则哈希中还有一些不必要的尾随逗号。也许不足以导致错误,但当我遇到意外行为时,我总是很想清理类似的东西。[注意:@Sparky,这只是旧版本 IE 中的问题。]

PS:原始海报解决了由于使用隐藏字段而导致出生功能失败的问题,该隐藏字段被浏览器(firefox)的无效数据静默填充并导致验证失败。

于 2012-12-31T14:25:46.180 回答