1

当我尝试使用从一页导航到另一页（单页模板）时，如何使JQM 加载消息changePage("$('#page-id')", { transition: "none" });显示出来？

截至目前，我$.mobile.loading("show");在 changePage 发生之前打电话。

我已经尝试过this和this中的方法，但它仍然不起作用。我在单击源页面中的按钮时使用 changePage 。上述链接中提供的方法仅适用于 FF。不适用于 Android、iOS 原生浏览器以及 Chrome 或 Safari。

哦，我正在使用 JQM v1.2.0 稳定版。

编辑： 继承人我使用的代码

$(".listview").live("click", function () {
     $.mobile.loading('show', {
        text: 'Please wait... Loading...',
        textVisible: true,
        theme: 'a',
        textonly: true
    });
    var v1= $(this).attr("v1");
    //var CourseID = "";
    var v2= $(this).attr("v2");
    var v3= $.trim($(this).children("h3").text());
    var v4= $.trim($(this).find("span").children("span:first").text());
    var v5= $.trim($(this).children("p:last").text());
    $.ajax({
            async: false,
            type: "POST",
            url: "//url of the webmethod//",
            data: "{v1:" + v1+ ", p:" + id + "}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            cache: false,
            success: function (msg) {
                ViewModel.variable1({ //binding data to ViewModel here//
                });
                $.mobile.changePage("#course-pg", { transition: "none" });
            },
            error: function (msg) {
                $("#errorpopup").popup('open');
            },
            complete: function () {
                $.mobile.loading('hide');
            }
        });
});
4

2 回答 2

1

我也一直在思考这个问题。

问题是，您可能正在做所有事情，调用微调器，调用 changePage，......问题是（在我看来），微调器只显示while the page is loading而不是while the loaded page is rendering. 假设您加载了一个 2k 的 gzipped 页面，该页面实际上加载速度太快，您甚至看不到微调器。根据正在加载的小部件，增强需要相当长的时间，因此您的微调器对于少数ms页面加载可见，但对于2-3 seconds页面呈现不可见。

我正在使用我自己的微调器调用（JQM 1.1）：

var spin = 
    function( what ){
        if ( what == "show"){
            console.log("SHOWIN");
            $.mobile.showPageLoadingMsg();
            } else {
            console.log("HIDING");
            $.mobile.hidePageLoadingMsg()
            }
        };

将其放入您的代码中，并在进行 changePage 调用之前手动触发它：

 spin("show");

并在回调中，或您之后使用的任何处理程序中，

 spin("hide");

这应该让您了解微调器何时显示以及何时离开。

如果您想知道，我希望微调器会在渲染期间显示。那会更有用，但我不确定这是可能的。

于 2012-10-06T21:39:01.660 回答
0

我终于找到了解决这个问题的方法。它实际上是非正统的，我不知道为什么这是唯一的方法。不管怎样，就到这里吧。我创建了一个href设置为第二页的锚标记并使用 css 隐藏它。

<a href="#page-id" id="linktonext" style="display:none">Click here</a>

我首先有$.mobile.loading("show");，在 ajax 调用获取数据之后，会触发单击此锚标记。在pageinit第二页上，我用来自 ajax 调用的数据填充页面。在此之后，我打电话给$.mobile.loading("hide"). 完美运行。

于 2012-10-23T20:43:15.687 回答