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

Question

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

正常情况是用户使用 link（锚点）加载页面，所以我正在处理 jquery 移动事件 "pageinit"，它工作正常，但我当用户使用浏览器的后退按钮访问页面时，需要执行相同的 code/function，在这种情况下，永远不会触发 "pageinit" 事件。

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 and load 活动！

来自文档： 遍历会话历史条目时会触发 pageshow 事件。（这包括 back/forward 以及 onload 事件后的初始页面显示。）

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

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

    myFunction();
});

Answer 2

最后我发现这个让我解决了这个问题，基本上是使用 window 事件 "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：事件 "pageshow" 已被大多数不同于 Safari Mobile 的浏览器完美评估，因此它正在检查这些情况。

注意 2：我在 Safari Mobile 9.1 (iOS 9.3) 上测试了这段代码。

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

Execute js function when accessing a page from browser's back button

javascript

jquery

mobile-safari

jquery-mobile