Question

我正在使用jquery mobile 1.2.0和jquery 1.7.2开发一个网站，我在尝试在加载页面时执行js函数时遇到了问题。

正常情况是用户使用链接（锚点）加载页面，因此我处理jquery移动事件＆＃34; pageinit＆＃34;，这可以正常工作，但我需要执行相同的操作当用户使用浏览器的后退按钮访问页面时的代码/功能，在这种情况下，＆＃34; pageinit＆＃34;事件永远不会被解雇。

javascript函数修改了UI，因此在调用函数之前需要加载UI。

我在Safari 9.1（iOS 9.3）上测试它。

我的网页与此非常相似：

<section id="someid" data-role="page" data-theme="a">
<!-- Page content -->
</section>

<script type="text/javascript">
function myFunction() {
//some code to modify de UI on page loaded
}

$("#someid").on("pageinit", function (e) {
    var page = $(this);

    myFunction();
});
</script>

更新1：

我已经测试了here列出的所有jquery手机事件而没有任何运气。

Answer 1

尝试pageshow和load事件！

从文档中： 在遍历会话历史记录条目时会触发pageshow事件。（这包括后退 /转发以及onload事件后的初始页面显示。）

另外，仅供参考，看起来pageinit已depracated in 1.4

$(document).on("pageshow", "#someid", function (e) {
    var page = $(this);

    myFunction();
});

Answer 2

最后我发现这个SO question让我解决了这个问题，基本上就是使用窗口事件“popstate”，这里是我使用的确切代码：

<section id="someid" data-role="page" data-theme="a">
<!-- Page content -->
</section>

<script type="text/javascript">
function myFunction() {
//some code to modify de UI on page loaded
}

$("#someid").on("pageinit", function (e) {
    var page = $(this);

    myFunction();
});

var myCustomEvent = (navigator.userAgent.match('iPhone') != null) ? 'popstate' : 'pageshow';

$(window).on(myCustomEvent, function(e) {
    myFunction();
}
</script>

注1：大多数不同于Safari Mobile的浏览器都会对事件“pageshow”进行完美评估，因此会针对这些情况进行检查。

注意2：我在Safari Mobile 9.1（iOS 9.3）上测试了此代码。

从浏览器的后退按钮访问页面时执行js功能

2 个答案: