Jquery验证器第二次不工作

Question

当我提交表单时，Jquery验证器不能再次工作。验证程序未第二次附加到提交事件。

我没有提交处理程序，但valid（）函数也没有被调用。

<script> 
    $(document).ready(function() { 
     $("#login_form").submit(function() { 
      $("#login_form").validate({ 
       rules: { 
        username: { 
         required: true 
        }, 
        password: { 
         required: true, 
         minlength: 6 
        } 
       }, 

       messages: { 
        username: { 
         required: "Enter your username" 
               }, 
        password: { 
         required: "Enter your password", 
         minlength: "Password must be minimum 6 characters" 
        }, 
       }, 



       errorPlacement: function(error, element) { 
        error.hide(); 
        $('.messagebox').hide(); 
        error.appendTo($('#alert-message')); 
        $('.messagebox').slideDown('slow'); 



       }, 
       highlight: function(element, errorClass, validClass) { 
        $(element).parents('.form-group').addClass('has-error'); 
       }, 
       unhighlight: function(element, errorClass, validClass) { 
        $(element).parents('.form-group').removeClass('has-error'); 
        $(element).parents('.form-group').addClass('has-success'); 
       } 
      }); 

      if ($("#login_form").valid()) { 
       var data1 = $('#login_form').serialize(); 
       $.ajax({ 
        type: "POST", 
        url: "login.php", 
        data: data1, 
        dataType: 'json', 
        success: function(msg) { 

         if (msg.result == 1) { 
         $('.messagebox').addClass("success-message"); 
         $('.message').slideDown('slow'); 
         $('#alert-message').text("Logged in.. Redirecting"); 

          $('#login_form').fadeOut(5000); 
          window.location = "members.php" 
         } else {  
         console.log(msg.result); 
         $('.messagebox').hide(); 
         $('.messagebox').addClass("error-message"); 
         $('#alert-message').html(msg.result); 
         $('.messagebox').slideDown('slow'); 
         } 
        } 
       }); 
      } 
      return false; 
     }); 

    }); 
</script> 

Answer 1

的问题是在这里：

$("#login_form").submit(function() { 
     $("#login_form").validate({... 

你重新绑定验证每个表单提交，您的验证绑定只应在的document.ready事件一次设置，你应该始终设置/绑定jquery只在文档就绪事件和页面加载中进行验证，而不是在Ajax回发中再次进行验证。你在射击验证正确的检查中多次提交表单的事件，像这样虽：

$("#login_form").submit(function() { 
    if ($("#login_form").valid()) {... 

这里是固定的代码：

<script> 
$(document).ready(function() { 

     $("#login_form").validate({ 
      rules: { 
       username: { 
        required: true 
       }, 
       password: { 
        required: true, 
        minlength: 6 
       } 
      }, 

      messages: { 
       username: { 
        required: "Enter your username" 
              }, 
       password: { 
        required: "Enter your password", 
        minlength: "Password must be minimum 6 characters" 
       }, 
      }, 



      errorPlacement: function(error, element) { 
       error.hide(); 
       $('.messagebox').hide(); 
       error.appendTo($('#alert-message')); 
       $('.messagebox').slideDown('slow'); 



      }, 
      highlight: function(element, errorClass, validClass) { 
       $(element).parents('.form-group').addClass('has-error'); 
      }, 
      unhighlight: function(element, errorClass, validClass) { 
       $(element).parents('.form-group').removeClass('has-error'); 
       $(element).parents('.form-group').addClass('has-success'); 
      } 
     });//end validate bindings/settings 


    $("#login_form").submit(function() { 
          //fire validation checks 
     if ($("#login_form").valid()) { 
      var data1 = $('#login_form').serialize(); 
      $.ajax({ 
       type: "POST", 
       url: "login.php", 
       data: data1, 
       dataType: 'json', 
       success: function(msg) { 

        if (msg.result == 1) { 
        $('.messagebox').addClass("success-message"); 
        $('.message').slideDown('slow'); 
        $('#alert-message').text("Logged in.. Redirecting"); 

         $('#login_form').fadeOut(5000); 
         window.location = "members.php" 
        } else {  
        console.log(msg.result); 
        $('.messagebox').hide(); 
        $('.messagebox').addClass("error-message"); 
        $('#alert-message').html(msg.result); 
        $('.messagebox').slideDown('slow'); 
        } 
       } 
      }); 
     } 
     return false; 
    }); 

});