在jQuery mobile上的數據請求前顯示頁面

當我的移動Web應用程序（運行在PhoneGap內部）啓動時，它會執行來自服務器的數據請求。問題是屏幕在執行此請求時保持黑屏。當此請求在啓動時以外的任何時間執行時，該應用程序會顯示一個加載對話框，以向用戶提供一些反饋，指出正在加載的內容，但在啓動時，它不會以這種方式運行。在jQuery mobile上的數據請求前顯示頁面

我正在執行pageshow事件處理程序中的請求。

下面是代碼：

$("#home").on("pageshow", onHomeShow); 

... 

function onHomeShow() { 
    syncData(); 
} 

function syncData() { 
    // show loading dialog and get the data here 
}

任何和所有幫助將不勝感激。提前致謝。

來源

2013-05-22 the_new_mr

如果你做這樣的事情

document.addEventListener('deviceready', this.onDeviceReady, false); 

function onDeviceReady() { 
syncData(); 
}

來源

2013-05-22 12:28:04 dpfauwadel

謝謝！這很好。如此簡單而有效。我仍然希望應用程序在每次自動進入主頁時同步數據，因此我將在其中放置一些邏輯，以便在onDeviceReady運行時設置一個標誌，以便在標誌設置時僅從onHomeShow運行。再次感謝！ –

然後你應該自己觸發一個jax loader，它可以很容易地完成。它會向用戶表明發生了一些事情。另外如果可能的話，在pagebeforecreate之類的一些早期頁面事件中初始化你的方法。

工作例如：http://jsfiddle.net/Gajotres/Zr7Gf/

$(document).on('pagebeforecreate', '[data-role="page"]', function(){  
    setTimeout(function(){ 
     $.mobile.loading('show'); 
    },1);  
}); 

$(document).on('pageshow', '[data-role="page"]', function(){ 
    setTimeout(function(){ 
     $.mobile.loading('hide'); 
    },300);  
});

在我的例子，因爲除非用的setTimeout或setInterval的執行網絡套件瀏覽器不會顯示加載需要的setTimeout。使用此塊：

setTimeout(function(){ 
    $.mobile.loading('hide'); 
},1);

當您的函數執行結束時。如果你想了解更多關於jQM頁面事件的信息，請看我的其他答案：jQuery Mobile: document ready vs page events或官方documentation。

編輯：

我忘了，你的初始頁面的id更換[data-role="page"]。

來源

2013-05-22 12:27:56 Gajotres

感謝輸入，但我的問題是，它在啓動時運行太早，爲時不晚。另外，我還不清楚，我已經顯示加載對話框並手動加載數據。感謝您的其他答案，但鏈接。我從中學到了很多東西，並將它作爲參考書籤。 –

在jQuery mobile上的數據請求前顯示頁面

回答

相關問題