jQuery Mobile - 让showPageLoadingMsg与pagebeforeshow或pagebeforeceate一起使用的问题

Question

我正在尝试解决此问题的第二周,以获取正确显示的加载消息:-(

我只是有一个非常艰难的时间越来越无论是pagebeforecreate或pagebeforeshow事件来触发$ .mobile.showPageLoadingMsg().

这是jsfiddle上的示例链接:

    [http://jsfiddle.net/7fxQf/25/][1]

请注意,jsFiddle引用了移动1.0b3库.

以下是应该有效的基本代码段示例,但不是:

$('#mypageone').live('pagebeforecreate', function (event, ui) {
   alert('Just selected page one!');
   //HEY!!! the page load never pops up :-(
   $.mobile.loadingMessage = "this msg set on live pageshow from mypageone...";
   $.mobile.pageLoading();
   $.mobile.showPageLoadingMsg();
  calcLongList();  //simple list generation of a 1000 lines to screen
 //$.mobile.hidePageLoadingMsg();
});

当页面实际加载时,我可以触发警报,但遗憾的是不是加载消息.

...但但是,如果变化只是"pageshow",负载信息会在5-10秒后显示,当然它需要生成列表:-( ...这当然不是我想要的.

另外,如果我注释掉calcLongList函数并不重要...页面加载msg表现相同:适用于'pageshow'...但不适用于'pagebeforeshow'或'pagebeforecreate'......我拉着我的头发想弄清楚我可能做错了什么？

任何建议或指导肯定会受到赞赏,在此先感谢

Answer 1

当jQM显示加载指示符时,它会向使用$ .mobile.hidePageLoadingMsg()删除的html对象(.ui-loading)添加一个类.但在某些情况下,它不会将此类添加到html中(因为它不能 - 尝试手动添加它).

简单(稍微脏)修复是手动将类添加到html对象,而不是正文:

$('body').addClass('ui-loading');

要删除加载微调器,只需再次删除该类:

$('body').removeClass('ui-loading');

Answer 2

我有同样的问题。我不确定这是否是由同一件事引起的，但我的页脚工具栏是内联的。因此，我滚动到页面底部，单击要加载的页面，然后在下一页上触发加载消息（我正在执行一些动态 ajax 加载内容）。看起来加载消息不存在，但实际上是存在的。它的“顶部”值大约为 1700 像素，所以我看不到它。当我单击页面顶部的同一页面的链接时，我可以正常看到加载消息。

看起来 jQM 正在尝试保留加载消息或其他内容。没有把握。

所以..这就是你的指导。除了做类似的事情之外，我还没有答案给你：

$(".ui-loader").css({"top": "400px"});

这可能就是我要做的。希望有帮助！

编辑

这就是我不得不做的事情。经过测试，它有效。当我开始 ajax 调用时：

$(".ui-loader").css({"display": "block", "top": "252px !important" });

当 ajax 调用完成时：

$(".ui-loader").css({ "display": "none" });

编辑2

抱歉，经过一些测试，我发现您不想设置“display: block;” 或“显示：无；” 使用 .css() jQuery 函数。这将在元素本身上设置样式属性并覆盖 jQM 想要执行的操作。相反，在开始通话时执行此操作：

$(".ui-loader").css({ "top": "252px !important" });
$.mobile.showPageLoadingMsg();

加载完成后：

$.mobile.hidePageLoadingMsg();