jQuery Mobile顯示微調

Question

我正在開發一個jQuery Mobile網站，並使用jQuery驗證插件來驗證我的表單。在某些表單上，我設置了data-ajax =「false」，但仍想在點擊提交按鈕時顯示加載微調器。 要顯示我使用下面的代碼

// Display spinner 
$(document).delegate('.ajaxSpinner', 'click', function() { 
    if($(".ajaxValidate").length == 0 || $(".ajaxValidate").valid()) { // Show spinner if no validation or form is valid 
     $.mobile.showPageLoadingMsg(); 
    } 
}); 

形式微調提交按鈕具有一個類的ajaxSpinner'的，和形式本身具有類「ajaxValidate」的。

在大多數表單上，這很好用，如果單擊提交時表單無效，則看不到微調框，而如果表單有效，則會顯示微調框。

我只有一個單獨的表單不能很好地演奏....無論表單是否有效，表單很長，所以我想知道在我的手動顯示微調代碼觸發之前驗證是否完成。

我不是很熟練jQuery，所以任何人都可以發現我的代碼中的缺陷？ 它可能是一個時間問題？如果是這樣，有沒有一種好方法可以確保在點擊功能觸發之前完成驗證？

Answer 1

我認爲你需要在驗證函數內調用微調器。

因此，使用驗證插件，您可以通常有這樣的事情：

$(".ajaxValidate").validate({ 
    submitHandler : function(form) { 

     // START YOUR SPINNER HERE 
     $.mobile.showPageLoadingMsg(); 

     $(form).ajaxSubmit({ 

      success: function() { // YOUR FORM WAS SUBMITTED SUCCESSFULLY 

       // DO SOMETHING WHEN THE FORM WAS SUBMITTED SCESSFULLY ... 
       // ... 

       // STOP THE SPINNER EVENTUALLY 
       //$.mobile.hidePageLoadingMsg() 

      } 
     }); 
    } 
}); 

希望這有助於。讓我知道這是否適合你。