javascript - 如何防止后退箭头关闭 Opera Mobile 12 中的弹出窗口？

Question

我的应用程序有一个弹出窗口，运行 Opera Mobile 12(唯一支持代理的移动浏览器和最后一个“真正的”Opera 浏览器)的 Android 平板电脑将其呈现为全屏窗口。这很好，但出现的问题是任何错误的后退箭头点击都会立即关闭他们正在使用的窗口，因为 Opera 不支持 beforeunload 事件，当用户意外点击靠近窗口时会感到沮丧屏幕底部并点击后退箭头。

如何在 Opera Mobile 12 中防止后退箭头在没有警告的情况下关闭窗口？

Answer 1

我通过利用新的 History API 解决了这个问题:

// snippet goes in the setup/DOMContentLoaded phase    
if (typeof window.onbeforeunload !== "undefined") {
    // [standard warnings and whatnot here for non-Opera users]
} else {
    // [optionally include checks for history support, if targeting multiple browsers]

    // force Opera forward whenever a history state is popped
    window.addEventListener("popstate", function(e) {
        history.forward();
    });

    // Create a new history state as soon as the popup window loads
    history.pushState(null, "Page Title Here");
}

这是通过在页面加载后立即在导航历史记录中创建一个新条目，然后每次从堆栈中弹出该状态(即用户点击后退箭头)时强制浏览器前进来实现的。

您可以轻松修改此设置以显示分配给 window.onbeforeunload 的相同警告，并在用户需要时关闭弹出窗口，而不是完全禁用关闭后退按钮功能.