jQuery驗證：驗證形式兩個部分

Question

我想驗證一個表單兩個部分，當我點擊btn按鈕，然後驗證正確完成，但是當我點擊btnn它不工作，始終驗證字段1

這是我的代碼

的jQuery：

$(document).ready(function() { 
    $("#form1").validate({ 
     rules: { 
      field1: "required" 
     }, 
     messages: { 
      field1: "Please specify your name" 

     } 
    }) 

    $('#btn').click(function() { 
     $("#form1").valid(); 
    }); 
    $("#form1").validate({ 
     rules: { 
      field2: "required" 
     }, 
     messages: { 
      field2: "Please specify your name" 

     } 
    }) 

    $('#btnn').click(function() { 
     $("#form1").valid(); 
    }); 
}); 

HTML

<form id="form1" name="form1"> 
    Field 1: <input name="field1" type="text" /> 
    Field 2: <input name="field2" type="text" /> 
</form> 

<div> 
    <input id="btn" type="button" value="Validate"/> 
    <input id="btnn" type="button" value="Validate"/> 
</div> 

有什麼建議嗎？

Answer 1

按照設計，您不能在同一表單上調用.validate()方法兩次。 .validate()方法用於初始化，第二個實例將始終被忽略。

你這裏有兩種選擇：

1. 認沽部分2到自己<form>容器。

OR

一些其他特技像顯示/隱藏的表單字段，或使用.rules()方法來添加/刪除動態取決於被點擊了哪個按鈕的規則。如果您顯示/隱藏這些字段，則在.validate()的同一個實例中聲明所有規則，並利用此插件的默認行爲，即忽略所有隱藏的字段。

既然您還沒有透露您的多部分表格的工作原理，或者想要驗證兩個部分的目的，我會告訴您最簡單的解決方案，這是建議＃1。

jQuery的：

$(document).ready(function() { 

    $("#form1").validate({ // initialize `form1` 
     rules: { 
      field1: "required" 
     }, 
     messages: { 
      field1: "Please specify your name" 
     } 
    }); 

    $('#btn').click(function() { 
     $("#form1").valid(); 
    }); 

    $("#form2").validate({ // initialize `form2` 
     rules: { 
      field2: "required" 
     }, 
     messages: { 
      field2: "Please specify your name" 
     } 
    }); 

    $('#btnn').click(function() { 
     $("#form2").valid(); 
    }); 
}); 

HTML：

<form id="form1" name="form1"> 
    Field 1: <input name="field1" type="text" /> 
</form> 

<form id="form2" name="form2"> 
    Field 2: <input name="field2" type="text" /> 
</form> 

<div> 
    <input id="btn" type="button" value="Validate"/> 
    <input id="btnn" type="button" value="Validate"/> 
</div> 

這裏是在多步驟的形式如何可以做另外一個答案：

https://stackoverflow.com/a/20481497/594235