點擊下一步按鈕和擊中輸入jQuery驗證之間的差異驗證

Question

我有jQuery驗證表單，不讓用戶下一步，直到他履行的形式。

有趣的是，用戶不能進一步按Next按鈕，但只需按下輸入即可。

見例如：https://jsfiddle.net/r6sztnsh/1/

走在前面，並禁止用戶打輸入是另一回事，但我想打輸入做同樣與點擊Next按鈕。

Java腳本：

$(document).ready(function(){ 

     // Custom method to validate username 
     $.validator.addMethod("usernameRegex", function(value, element) { 
      return this.optional(element) || /^[a-zA-Z0-9]*$/i.test(value); 
     }, "Username must contain only letters, numbers"); 

     $(".next").click(function(){ 
      var form = $("#myform"); 
      form.validate({ 
       errorElement: 'span', 
       errorClass: 'help-block', 
       highlight: function(element, errorClass, validClass) { 
        $(element).closest('.form-group').addClass("has-error"); 
       }, 
       unhighlight: function(element, errorClass, validClass) { 
        $(element).closest('.form-group').removeClass("has-error"); 
       }, 
       rules: { 
        username: { 
         required: true, 
         usernameRegex: true, 
         minlength: 6, 
        }, 
        password : { 
         required: true, 
        }, 
        conf_password : { 
         required: true, 
         equalTo: '#password', 
        }, 
        company:{ 
         required: true, 
        }, 
        url:{ 
         required: true, 
        }, 
        name: { 
         required: true, 
         minlength: 3, 
        }, 
        email: { 
         required: true, 
         minlength: 3, 
        }, 

       }, 
       messages: { 
        username: { 
         required: "Username required", 
        }, 
        password : { 
         required: "Password required", 
        }, 
        conf_password : { 
         required: "Password required", 
         equalTo: "Password don't match", 
        }, 
        name: { 
         required: "Name required", 
        }, 
        email: { 
         required: "Email required", 
        }, 
       } 
      }); 
      if (form.valid() === true){ 
       if ($('#account_information').is(":visible")){ 
        current_fs = $('#account_information'); 
        next_fs = $('#company_information'); 
       }else if($('#company_information').is(":visible")){ 
        current_fs = $('#company_information'); 
        next_fs = $('#personal_information'); 
       } 

       next_fs.show(); 
       current_fs.hide(); 
      } 
     }); 

     $('#previous').click(function(){ 
      if($('#company_information').is(":visible")){ 
       current_fs = $('#company_information'); 
       next_fs = $('#account_information'); 
      }else if ($('#personal_information').is(":visible")){ 
       current_fs = $('#personal_information'); 
       next_fs = $('#company_information'); 
      } 
      next_fs.show(); 
      current_fs.hide(); 
     }); 

    }); 

*

我想魔術將圍繞$(".next").click(function(){ var form = $("#myform");在這裏:)

任何想法某處發生在使擊中具有相同點擊進入Next？

Answer 1

所以，你要回車按鍵做同樣的事情，你點擊下一步按鈕呢？基於你的jsfiddle你表格：

$('.form-horizontal').keypress(function (event) { 
    if (event.which === 13) { 
     $(".next").trigger('click'); 
    } 
}); 

Answer 2

如果形式不使用的情況下完成。防止提交「提交」：

form.on('submit',fonction(pEvent){ 
    if(/* form not complete */) { 
     pEvent.preventDefault(); 
    } 
});