jQuery Mobile showPageLoadingMsg（）/ hidePageLoadingMsg（）方法无法在初始页面加载 [英] jQuery Mobile showPageLoadingMsg()/hidePageLoadingMsg() methods not working on initial page loadn

问题描述

我正在使用jQuery Mobile编写一个webapp，它调用一个函数将记录加载到localStorage，并在最初创建页面时从远程JSON文件创建一个列表视图（使用 live.pagecreate（）页面事件）。在这个函数的开头是jQuery Mobile方法 $ .mobile.showPageLoadingMsg（）和 $。mobile.hidePageLoadingMsg（）在函数的末尾。

I am writing a webapp using jQuery Mobile that calls a function to load records into localStorage and create a listview from a remote JSON file when the page is initially created (using the live.pagecreate() event for the page). At the beginning of this function is the jQuery Mobile method $.mobile.showPageLoadingMsg() and $.mobile.hidePageLoadingMsg() is at the end of the function.

在初始页面创建时，未显示加载消息（在iPhone 4上使用iOS 4.3 Safari，Chrome 13和Firefox 5）。但是，我在页面上也有一个刷新按钮;此按钮清除localStorage中的关联记录，然后调用用于最初填充列表视图的相同函数。但是，从刷新按钮调用相同的函数时， showPageLoadingMsg（）和 hidePageLoadingMsg（）都能正常工作加载屏幕出现并消失。我在这里遗漏了什么吗？

On the initial pagecreate, the loading message does not appear (on iPhone 4 with iOS 4.3 Safari, Chrome 13 and Firefox 5). However, I also have a refresh button on the page; this button clears the associated records in localStorage then calls the same function used to initially populate the listview. However, when calling the same function from the refresh button the showPageLoadingMsg() and hidePageLoadingMsg() both work correctly and the Loading screen appears and disappears as it should. Am I missing something here?

ETA 以下是代码的要点（如果需要，现在不在实际代码的前面）我今晚会把它放进去。）我还应该提一下，我已经尝试将showPageLoadingMsg放在（document）.ready中并试图将它绑定到mobileinit并且都没有工作：

ETA Here is the gist of the code (not in front of the actual code right now, if you need more I will put it in tonight). I also should mention that I've tried to put showPageLoadingMsg in (document).ready and have tried to bind it to mobileinit and neither have worked:

function loadListView(){
   $.mobile.showPageLoadingMsg();
   //ajax call to pull JSON
   //$.each loop to load localStorage and listview
   $.listview.refresh('list');
   $.mobile.hidePageLoadingMsg();
}

$(#listpage).live('pagecreate', function(event){
   loadListView(); // showPageLoadingMsg() and hidePageLoadingMsg do not work when the function is called here
});

function clearList(){
   //for loop that clears each item in localStorage that matches the key prefix set in loadListView
}

//runs when refresh button is clicked
$('listrefresh').live('click',function(){
   clearList();
   loadListView(); //showPageLoadingMsg() and hidePageLoadingMsg() work when the function is called here
});

推荐答案

对于这些处理程序来说在初始页面
load期间调用，你必须在jQuery Mobile执行之前绑定它们。这可以在mobileinit处理程序中完成
，如全局配置
页面所述。

For these handlers to be invoked during the initial page load, you must bind them before jQuery Mobile executes. This can be done in the mobileinit handler, as described on the global config page.

文档：

• http://jquerymobile.com/demos/1.0b2/#/demos/1.0b2/docs/api/events.html

• http://jquerymobile.com/demos/1.0b2/#/demos/1.0b2/docs/api/events.html

初始化后，在初始化页面上触发。
我们建议绑定到此事件而不是DOM ready（），因为无论页面是直接加载还是将
内容作为Ajax的一部分拉入另一个页面，这个
都能正常工作导航
系统。

Triggered on the page being initialized, after initialization occurs. We recommend binding to this event instead of DOM ready() because this will work regardless of whether the page is loaded directly or if the content is pulled into another page as part of the Ajax navigation system.

示例：

• http://jsfiddle.net/phillpafford/mKn8Y/8/

• http://jsfiddle.net/phillpafford/mKn8Y/8/

在示例中，没有任何实时事件在初始页面加载时触发，您必须在mobileinit中配置此类操作：

In the example none of the live events fire on initial page load, you have to configure this type of action in the mobileinit:

• http://jquerymobile.com/demos/1.0b2/#/demos/1.0b2/docs/api/globalconfig.html

• http://jquerymobile.com/demos/1.0b2/#/demos/1.0b2/docs/api/globalconfig.html

这篇关于jQuery Mobile showPageLoadingMsg（）/ hidePageLoadingMsg（）方法无法在初始页面加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！