1

我在 html 页面上有两个 jquery 移动“页面”(指定为页面的 div)。我想在每次访问页面时调用方法。我连接了触发“pageinit”事件的方法。但是,它只会被调用一次,并且不会在后续的 changePage 调用中被调用。

这是一个jsFiddle 来演示。(时间戳应该在 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"));

});
4

1 回答 1

3

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());
});
于 2013-04-10T18:36:11.847 回答