jquery驗證（使用jQuery驗證插件） - 基於點擊按鈕激活特定元素的驗證規則

Question

好吧，我遇到了一個煩人的問題。我在我的研究中瞭解到，多次使用validate（）不起作用。所以我設置了一個響應點擊某些按鈕的按鈕的功能。這些按鈕發送一個參數來標識要驗證的元素。我這樣做是因爲我正在使用.fadeOut（）/。fadeIn（）無縫地從節到節。一旦你點擊了第一部分按鈕（這會將你帶到第二部分），它將驗證第一部分中的元素，如果第一部分被認爲是'有效'，那麼它將繼續執行fadeOut/fadeIn到部分b ....等等上。

問題是，儘管我已經爲a和b部分設置了規則和消息，但b部分似乎仍未驗證。

這裏是我的代碼 -

function validation(page) { 
var rules; 
var messages; 
var validator; 

if (page == 'secA') { 
    rules = { 
     /*gneral information validation*/ 
     gCompanyTxt: { 
      required: true, 
      minlength: 2 
     } 

    messages = { 
     /*general info validator messages*/ 
     gCompanyTxt: { 
      required: "The 'Company' text box is empty safgadfgad", 
      minlength: "The 'Company' text box needs to have at least 2 characters" 
     } 
    }; 

    validator = new jQueryValidatorWrapper("form1", rules, messages); 

} else if (page == 'secB') { 
    rules = { 
     txtFirst: { 
      required: true, 
      minlength: 2 
     } 
    }; 

    messages = { 
     txtFirst: { 
      required: "Your first name is required", 
      minlength: "Your first name needs to be at least two characters" 
     } 
    }; 

    validator = new jQueryValidatorWrapper("form1", rules, messages); 

} 

if (!validator.validate()) { 
    return; 
} else { 
    if (page == 'secA') { 
     $('#secA').hide(); 
     $('#secB').fadeIn('slow'); 
    } else if (page == 'secTwo') { 
     $('#secB').hide(); 
     $('#secC').fadeIn('slow'); 

    } 
} 
} 

的按鈕是這樣：

<button type = "button" class="buttonSale" id="btnA" onclick="validation('secA')">Proceed to Section B</button> 

<button type = "button" class="buttonSale" id="btnB" onclick="validation('secB')">Proceed to Section C</button> 

這樣做的結果是 - 當點擊「btnA」代碼工作有效，如果事情是空的或不正確的，驗證火災，我能夠解決這個問題，然後繼續前進。但是，一旦我在B部分，然後點擊「btnB」，它只是移動到下一個頁面，看似跳過if語句：

if (!validator.validate()) { 
    return; 
} 

我想我只是失去了一些東西很簡單在這裏，但我我厭倦了看它，需要專注於其他事情。謝謝！

Answer 1

這是使用jQuery.Validate嗎？如果是這樣，它將只驗證在屏幕上可見的元素，所以你不應該做任何特殊的邏輯來改變規則。只需一次分配所有規則，並確保它忽略隱藏的輸入。

一旦這樣做，你可以單擊事件綁定上的每個按鈕來檢查使用$(yourForm).validate().form()和頁面到下一屏形式的驗證狀態，如果它回來真（有效）。流程中的最後一個按鈕實際上應該提交。