看起来苹果已经禁用了iOS设备(iPhone、iPad、iPod Touch)上的window.onbeforeunload事件。不幸的是,我找不到任何关于为什么Mobile Safari无法使用此事件的文档。
有没有人知道是否有可靠的替代方法?Android的浏览器似乎完全支持它,而Safari桌面应用程序也可以正常支持onbeforeunload事件。
看起来苹果已经禁用了iOS设备(iPhone、iPad、iPod Touch)上的window.onbeforeunload事件。不幸的是,我找不到任何关于为什么Mobile Safari无法使用此事件的文档。
有没有人知道是否有可靠的替代方法?Android的浏览器似乎完全支持它,而Safari桌面应用程序也可以正常支持onbeforeunload事件。
我看到这是一个老问题,但最近我也遇到了这个问题。
我正在使用 window.unload
,在 iOS 浏览器中它可以正常工作(尽管如果您查看 苹果文档,它似乎已经被弃用,他们推荐使用 document.pagehide
)。
根据Xavier的答案,我设计了以下解决方案:
function doStuff() {
// here goes your logic
}
function isSafariMobile() {
return navigator && /Safari/.test(navigator.userAgent) && /iPhone|iPad/.test(navigator.userAgent)
}
function addWatcherToLinks(baseNode) {
if (!baseNode || !baseNode.querySelectorAll) { return; } // ignore comments, text, etc.
for (const link of baseNode.querySelectorAll("a")) {
link.addEventListener('click', doStuff);
}
for (const form of baseNode.querySelectorAll("form")) {
form.addEventListener('submit', doStuff);
}
}
// ...when the page loads...
// we watch the page for beforeunload to call doStuff
// Since Safari mobile does not support this, we attach a listener (watcher) to each link and form and then call doStuff.
// Also, we add such a watcher to all new incoming nodes (DOMNodeInserted).
if (isSafariMobile()) {
addWatcherToLinks(document);
window.addEventListener("DOMNodeInserted", (event) => { addWatcherToLinks(event.target); }, false);
} else {
window.addEventListener('beforeunload', doStuff);
}
这个解决方案有一些限制。最大的限制是它会附加到所有表单和链接上。有时这可能不是所需的。如果需要,您可以跳过某些节点(例如,使用特定的data-
属性标记它们)。
我曾经遇到过同样的问题。似乎iPhone上的Safari浏览器只会触发焦点和失焦事件,而几乎所有其他事件都不会被触发,例如(pagehide、pageshow、可见性更改),但好消息是焦点和失焦事件也支持并在iPhone、iPad和Android手机上触发。
window.addEventListener('focus', function(){
// do stuff
});
window.addEventListener('blur', function(){
// do stuff
});
希望这能帮到任何人。