Question

我在html页面上有两个jquery移动“页面”（div指定为页面）。我想每次去页面时调用方法。我联系了'pageinit'事件的方法。但是，它只被调用一次，并且不会在后续的changePage调用中被调用。

这是jsFiddle to demonstrate。（时间戳应在pageinit上更改）

以下是我的完整代码https://gist.github.com/dev-e-loper/5356942

我的网页：

<div id="page1" data-role="page">
     <h1>One</h1>
 <a id="page1_link" data-role="button">go to page 2</a>

    <div id="page1_output"></div>
</div>
<div id="page2" data-role="page">
     <h1>Two</h1>
 <a id="page2_link" data-role="button">go to page 1</a>

    <div id="page2_output"></div>
</div>

连接pageinit处理程序的代码：

$("#page1").live('pageinit', function () {
    $("#page1_output").append('<br/> page 1 initialized. time - ' + new Date());
});


$("#page2").live('pageinit', function () {
    $("#page2_output").append('<br/> page 2 initialized time - ' + new Date());
});


$("#page1_link").live('click', function () {

    $.mobile.changePage($("#page2"));

});

$("#page2_link").live('click', function () {

    $.mobile.changePage($("#page1"));

});

Answer 1

首次加载页面时，

pageinit会触发。您的两个页面都缓存在DOM中，因此该事件只会触发一次。尝试pageshow，每次显示页面时都会触发。

此外，live()已弃用。您应该使用bind()或on()。

http://www.elijahmanor.com/2012/02/differences-between-jquery-bind-vs-live.html

$("#page1").bind('pageshow', function () {
    $("#page1_output").append('<br/> page 1 initialized. time - ' + new Date());
});


$("#page2").bind('pageshow', function () {
    $("#page2_output").append('<br/> page 2 initialized time - ' + new Date());
});

jQuery Mobile - 在后续的changePage调用中没有调用pageinit处理程序

1 个答案: