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

如果您在显示短信时遇到问题，请尝试以这种方式将jquery mobile.js设置文本更改为TRUE文件：

(function( $, window ) {
    // DEPRECATED
    // NOTE global mobile object settings
    $.extend( $.mobile, {
        // DEPRECATED Should the text be visble in the loading message?
        loadingMessageTextVisible: **undefined**,

        // DEPRECATED When the text is visible, what theme does the loading box use?
        loadingMessageTheme: undefined,

        // DEPRECATED default message setting
        loadingMessage: undefined,

TO：

(function( $, window ) {
    // DEPRECATED
    // NOTE global mobile object settings
    $.extend( $.mobile, {
        // DEPRECATED Should the text be visble in the loading message?
        loadingMessageTextVisible: **true**,

        // DEPRECATED When the text is visible, what theme does the loading box use?
        loadingMessageTheme: undefined,

        // DEPRECATED default message setting
        loadingMessage: undefined,

AXL

Answer 3

我遇到了同样的问题。我不确定它是否是由同一件事引起的，但我的页脚工具栏是内联的。所以我滚动到页面底部，单击要加载的页面，然后在下一页上触发加载消息（我正在做一些动态ajax加载内容）。看起来加载消息不存在，但它实际上是。它只有1700px左右的“顶部”值，所以我没有看到它。当我点击指向页面顶部同一页面的链接时，我看到加载消息正常。

看起来jQM试图保留加载消息或其他东西。不确定。

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

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

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

修改

这是我必须要做的事情。经过测试，确实有效。当我开始我的ajax电话时：

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

当ajax调用完成时：

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

编辑2

对不起，经过一些测试我发现你不想设置“display：block;”或“display：none;”使用.css（）jQuery函数。那将在元素本身设置style属性并覆盖jQM想要做的事情。这样做 - 开始通话时：

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

加载完成后：

$.mobile.hidePageLoadingMsg();

Answer 4

我做了一些测试，在我的项目中，它最终成为一个计时问题，如果我在代码中插入延迟或错误，则显示Wait微调器。当我删除它并与UI一起跟踪日志时，我可以看到花费时间的是UI渲染而不是数据加载。问候金

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

4 个答案: