如何讓用戶點擊要驗證的表單的按鈕？

Question

我有一組按鈕，需要其中的一個被點擊，以進入下一個表格：

<div class="btn-group" data-toggle="buttons-radio"> 
         <button type="button" class="btn" data-bind="click: sportYes">Yes</button> 
         <button type="button" class="btn" data-bind="click: sportBasic">Basic</button> 
         <button type="button" class="btn" data-bind="click: sportNo">No</button> 
        </div> 

我使用JQuery驗證，我想寫一個validate方法，但我可以沒有使用我的典型方法，比如給文本字段一個必需的值，例如

$("#FormThatNeedsToBeValidated").validate({ 
    rules: { 
     textinput1: { 
      required: true 
     }, 
     textinput2: { 
      required: true 
     }}}); 

即使我知道語法，我不認爲這會有所幫助，因爲不需要所有的按鈕。 有沒有辦法利用我的三個按鈕之一被點擊時呈現的active屬性？

Answer 1

A <button>沒有資格使用此插件進行驗證。

這個插件將僅在以下八種類型的數據輸入元件（每個必須具有唯一name屬性），其也必須被包含在表單元素內工作：

<form> 

    <!-- Textbox Input - Also including the various HTML5 input types --> 
    <input type="text" name="something" /> 

    <!-- Password Input --> 
    <input type="password" name="pw" /> 

    <!-- Radio Button --> 
    <input type="radio" name="foo" /> 

    <!-- Checkbox --> 
    <input type="checkbox" name="bar" /> 

    <!-- File Upload --> 
    <input type="file" name="upload" /> 

    <!-- Hidden Input - 'ignore: []' must be defined in the options --> 
    <input type="hidden" name="hide" /> 

    <!-- Select Dropdown --> 
    <select name="foobar"> ... </select> 

    <!-- Text Area Box --> 
    <textarea name="barfoo"></textarea> 

</form> 

另外看到文檔的「參考」頁：http://jqueryvalidation.org/reference/

---

爲了達到預期的效果，你可以測試&在點擊特定按鈕時提交表單。使用the .valid() method進行測試/檢查，並使用submit()提交表單。

HTML：

<button type="button" class="btn" id="sportYes">Yes</button> 
<button type="button" class="btn" id="sportBasic">Basic</button> 
<button type="button" class="btn" id="sportNo">No</button> 

jQuery的：

$(document).ready(function() { 

    $("#FormThatNeedsToBeValidated").validate({ // <- initialize plugin on form 
     // rules & options 
    }); 

    $('#sportYes').on('click', function() { 
     // stuff to do when this button is clicked 
     if ($("#FormThatNeedsToBeValidated").valid()) { // <- test validity 
      // stuff to do on valid form 
      $("#FormThatNeedsToBeValidated").submit(); // <- submit the valid form 
     } 
    }); 

    $('#sportBasic').on('click', function() { 
     // stuff to do when this button is clicked 
    }); 

    $('#sportNo').on('click', function() { 
     // stuff to do when this button is clicked 
    }); 

}); 

DEMO：http://jsfiddle.net/PgCr2/代替按鈕