jQuery mobile中更快的mobile.changePage

我有一個問題。我有一個登錄頁面，這是我的移動應用程序的第一頁，包含兩個字段：用戶名和密碼以及提交按鈕。提交後，我會進行ajax調用以檢查有效性，如果成功，它會將頁面切換到主頁。jQuery mobile中更快的mobile.changePage

問題：如果成功，它會顯示登錄頁面，兩個字段都會留空1-2秒，然後最終切換到主頁。非常緩慢或滯後。

$(document).bind('pageshow', function() {   
      $('#loginSubmit').on("click", function(){ 
        $('#loginSubmit').button('disable'); 
        var formData = $("#loginForm").serialize(); 
        console.log(formData); 
        $.ajax({ 
         type: "POST", 
         url: "php/checkLogin.php", 
         cache: false, 
         data: formData, 
         success: function(data){ 
          var check = $.parseJSON(data); 
          console.log(check); 
          if (check.approved == 1) 
          { 
           $.mobile.changePage('#home'); 
           username = $("#username").val(); 
          } 
          else 
          { 
           // wrong username or password 
          } 
         } 
        }); 
      }); 
     });

我已經添加了一個全局加載微調（這裏沒有顯示），但只顯示了半秒鐘後消失。我不知道如何處理這個。

控制檯日誌：

POST http://localhost/jquery/php/checkLogin.php 200 OK 1.02s 
POST http://localhost/jquery/ 200 OK 48ms

第一次調用似乎是有效的檢查，第二個我假設加載主頁。

來源

2012-12-23 jsquadrilla

$ .ajax不是你的問題，jQuery Mobile有一些性能問題（主要是Phonegap與android平臺相結合）。

在你的情況下，你可以做一些事情。

從我能看到你做提交作爲點擊事件的一部分。點擊事件有300毫秒的延遲。這通常可以（通常是因爲很多人不明白什麼時候使用fastclick實現）可以用fastclick來修復：。

最糟糕的情況，如果您要創建移動應用綁定touchstart事件而不是點擊事件。閱讀這篇文章，瞭解爲什麼：Touchstart vs Click. What happens under the hood?

最後ajax微調消失，因爲ajax調用進入一個成功的狀態，但頁面仍在加載。爲了應對仍然顯示它在這個Ajax調用點：

beforeSend: function() { 
    $.mobile.showPageLoadingMsg(true); 
}

卻隱藏着他在這個頁面事件：

$('#home').live('pageshow', function (event) { 
    $.mobile.hidePageLoadingMsg(); 
});

這將隱藏微調已成功加載頁面時。

來源

2012-12-23 09:10:11 Gajotres

jQuery mobile中更快的mobile.changePage

回答

相關問題