Javascript 在 *iPad 上的 Safari 上按“后退”按钮时未收到“pageshow”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10106457/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
'pageshow' is not received when pressing "back" button on Safari on *IPad"
提问by BreakPhreak
I have the following handler:
我有以下处理程序：
$(window).bind('pageshow', function() { alert("back to page"); });
When I navigate away from the page (by pressing on a link) and return back to the page (by pressing the "back"button), the alert()is not called (IPad 2, iOS 5.1).
当我离开页面（通过按下链接）并返回页面（通过按下“返回”按钮）时，不会调用alert()（iPad 2，iOS 5.1）。
What am I doing wrong please? Any other event I need to bind to?
请问我做错了什么？我需要绑定的任何其他事件？
PS: interesting that pagehideis received properly when navigating away from the page.
PS：有趣的是，当导航离开页面时，页面隐藏被正确接收。
回答by Mika Tuupola
You can check the persistedproperty of the pageshowevent. It is set to false on initial page load. When page is loaded from cache it is set to true.
您可以检查事件的persisted属性pageshow。它在初始页面加载时设置为 false。当页面从缓存加载时，它被设置为 true。
window.onpageshow = function(event) {
if (event.persisted) {
alert("back to page");
}
};
For some reason jQuery does not have this property in the event. You can find it from original event though.
出于某种原因，jQuery 在事件中没有这个属性。你可以从原始事件中找到它。
$(window).bind("pageshow", function(event) {
if (event.originalEvent.persisted) {
alert("back to page");
}
};
回答by Brandon Boone
This is likely a caching issue. When you go back to the page via the "back" button, the page is being pulled from the cache (behavior is dependent on the browser). Because of this, your JS will not fire since the page is already rendered in the cache and re-running your js could be detrimental to layout and such.
这很可能是缓存问题。当您通过“后退”按钮返回页面时，页面正在从缓存中拉出（行为取决于浏览器）。因此，您的 JS 将不会触发，因为页面已经在缓存中呈现，并且重新运行您的 js 可能对布局等有害。
You should be able to overcome this by tweaking your caching headers in your response or using a handful of browser tricks.
您应该能够通过调整响应中的缓存标头或使用一些浏览器技巧来克服这个问题。
Here are some links on the issue:
以下是有关该问题的一些链接：
- Is there a cross-browser onload event when clicking the back button?
- After travelling back in Firefox history, JavaScript won't run
EDIT
编辑
These are all pulled from the above links:
这些都是从上面的链接中提取的：
history.navigationMode = 'compatible';<body onunload=""><!-- This does the trick -->- "Firefox 1.5+ and some next version of Safari (which contains the fix for bug 28758) supports special events called
pageshowandpagehide." - Using jQuery's
$(document).ready(handler) window.onunload = function(){};
history.navigationMode = 'compatible';<body onunload=""><!-- This does the trick -->- “Firefox 1.5+ 和某些下一个版本的 Safari（其中包含错误 28758 的修复程序）支持称为
pageshow和 的特殊事件pagehide。” - 使用 jQuery 的
$(document).ready(handler) window.onunload = function(){};
回答by Matthew
What you're doing there is binding the return value of alert("back to page")as a callback. That won't work. You need to bind a function instead:
你在那里做的是绑定alert("back to page")作为回调的返回值。那行不通。你需要绑定一个函数：
$(window).bind('pageshow', function() { alert("back to page"); });
回答by Pierre Ayel
I add the same problem where iOS does not always post the "pageshow" event when going back.
我添加了同样的问题，其中 iOS 在返回时并不总是发布“pageshow”事件。
If not, safari resumes executing JS on the page so I though a timer would continue to fire.
如果没有，safari 将继续在页面上执行 JS，因此我认为计时器会继续触发。
So I came with this solution:
所以我提出了这个解决方案：
var timer;
function onPageBack() { alert("back to page"); }
window.addEventListener('pageshow', function() {
if (event.persisted)
onPageBack();
// avoid calling onPageBack twice if 'pageshow' event has been fired...
if (timer)
clearInterval(timer);
});
// when page is hidden, start timer that will fire when going back to the page...
window.addEventListener('pagehide', function() {
timer = setInterval(function() {
clearInterval(timer);
onPageBack();
}, 100);
});
回答by Alexxxcs2 Null
you should checkout you page is has iFrame component? i dont know why , but i delete iFrame component to solve this question
你应该检查你的页面是否有 iFrame 组件？我不知道为什么，但我删除了 iFrame 组件来解决这个问题
回答by Can ürek
I solved that issue like that;
我就这样解决了这个问题；
$(window).bind("pageshow", function () {
setTimeout(function () {
back();
}, 1000);
});
function back() {
//YOUR CODES
}
