46

看起来 Apple 已禁用 iOS 设备（iPhone、iPad、iPod Touch）的 window.onbeforeunload 事件。不幸的是，我找不到任何文档说明为什么此事件在 Mobile Safari 中不起作用。

有谁知道这个功能是否有可靠的替代品？Android 的浏览器似乎可以很好地支持它，并且 Safari 桌面应用程序也支持 onbeforeunload 事件而没有问题。

4

4 回答 4

19

我看到这是一个老问题，但我最近遇到了这个问题。

我正在使用window.unload，它在 ios 浏览器中运行良好（尽管如果您查看Apple 文档，它似乎已被弃用，他们建议使用document.pagehide）

于 2014-10-04T13:53:25.580 回答
2

如果你真的需要它，你不能只获取所有链接、表单和 DOM 对象，它们有一个处理程序更改 url 并让它们等到你完成了你想要的。对于链接，您可以通过 getElementsByTagName 获取它们，检查 href 是否以除 # 以外的任何内容开头，然后添加您的 onbeforeunload 函数 add onclick（将在查看 href 之前调用该函数）。表单相同，但有 onsubmit。最后，对于使用 JavaScript 更改 href 的元素，您应该确保在添加调用 onbeforeunlaod 函数的 lsitener 时（或者，如果您使用 DOM0 或 DOM1 侦听器，您可以添加一些类，然后使用全局脚本检查该类的所有元素并将其添加到带有闭包的事件侦听器中。

但是您通常应该能够避免使用此事件（可能使用 cookie 来存储您想要每 x 秒发送一次的内容，并且在最坏的情况下允许在用户下次加载页面时查看它并且，在最好的情况下，能够在 onbeforeunload 或 onunload 发送 Ajax 请求，即使它只发送 http 标头，也可以让你得到你想要的）。

于 2011-04-23T22:24:25.233 回答
1

根据 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-属性标记它们）。

于 2020-03-08T16:38:30.893 回答
0

我遇到了同样的问题。似乎 iphone 中的 safari 浏览器仅触发焦点和模糊事件，几乎所有其他事件都没有触发，例如（页面隐藏、页面显示、可见性更改），但好消息是焦点和模糊事件在 iphone、ipad 和 Android 手机上得到支持和触发也是。

    window.addEventListener('focus', function(){
       // do stuff
     });

   window.addEventListener('blur', function(){
       // do stuff
     });

希望这对任何人都有帮助。

于 2020-06-25T07:06:34.020 回答