javascript jQuery Mobile showPageLoadingMsg()/hidePageLoadingMsg() 方法在初始页面加载时不起作用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7028925/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery Mobile showPageLoadingMsg()/hidePageLoadingMsg() methods not working on initial page loadn
提问by scottoliver
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.
我正在使用 jQuery Mobile 编写一个 web 应用程序,它调用一个函数将记录加载到 localStorage 中,并在最初创建页面时从远程 JSON 文件创建一个列表视图(使用live.pagecreate()
页面的事件)。这个函数的开头是 jQuery Mobile 方法$.mobile.showPageLoadingMsg()
,$.mobile.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?
在初始页面创建时,加载消息不会出现(在 iPhone 4 上使用 iOS 4.3 Safari、Chrome 13 和 Firefox 5)。但是,我在页面上也有一个刷新按钮;此按钮清除 localStorage 中的关联记录,然后调用用于最初填充列表视图的相同函数。但是,当从刷新按钮调用相同的函数时,showPageLoadingMsg()
和hidePageLoadingMsg()
都可以正常工作,并且加载屏幕按原样出现和消失。我在这里错过了什么吗?
ETAHere 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:
ETA这是代码的要点(现在不在实际代码前面,如果您需要更多,我会在今晚放上)。我还应该提到我已经尝试将 showPageLoadingMsg 放入 (document).ready 并尝试将其绑定到 mobileinit 并且都没有工作:
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
});
回答by Phill Pafford
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.
要在初始页面加载期间调用这些处理程序,您必须在 jQuery Mobile 执行之前绑定它们。这可以在 mobileinit 处理程序中完成,如全局配置页面所述。
Docs:
文档:
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.
在正在初始化的页面上触发,在初始化发生后。我们建议绑定到这个事件而不是 DOM ready() 因为无论是直接加载页面还是将内容作为 Ajax 导航系统的一部分拉入另一个页面,这都将起作用。
Example:
例子:
In the example none of the live events fire on initial page load, you have to configure this type of action in the mobileinit:
在示例中,在初始页面加载时不会触发任何实时事件,您必须在 mobileinit 中配置此类操作: