Internet Explorer上的Javascript onbeforeunload問題

Question

這是我的腳本：

<script type="text/javascript">
    var redirectFlag = false;
    if (+localStorage.tabCount > 0) {
        alert('Already a tab or window opened!');
        redirectFlag = true;
    } else {
        redirectFlag = false;
        localStorage.tabCount = 0;
    }
    localStorage.tabCount = +localStorage.tabCount + 1;
    window.onbeforeunload = function () {
        localStorage.tabCount = +localStorage.tabCount - 1;
    };
    if (redirectFlag) {
        var baseUrl = window.location.origin;
        window.location.href = baseUrl + 'mylocation';
    }
</script>

我想檢查是否打開了另一個選項卡。 該腳本適用於Firefox和Chrome。 但是在IE 11上， window.onbeforeunload被忽略。

是否有針對IE的解決方法？ 謝謝

Answer 1

beforeunload事件有幾個已知問題。 這里是其中的一些：

將事件處理程序/偵聽器附加到窗口或文檔的beforeunload事件，可防止瀏覽器使用內存中的頁面導航緩存，例如Firefox的Back-Forward緩存或WebKit的Page Cache 。

為了避免意外彈出窗口，除非頁面已與之交互，否則瀏覽器可能不會顯示在beforeunload事件處理程序中創建的提示， 甚至根本不會顯示它們 。

參考： https : //developer.mozilla.org/en-US/docs/Web/Events/beforeunload

如果目標瀏覽器支持的話，建議改用pageHide事件 。 您可以在這里找到有關其支持的信息： https : //caniuse.com/#search=pagehide

因此，您應該使用onpagehide而不是在onbeforeunload事件處理程序中減少localStorage.tabCount ：

window.onpagehide = function () {
  localStorage.tabCount = +localStorage.tabCount - 1;
};

您可以嘗試使用以下代碼筆查看它是否對您有用 ： https : //codepen.io/Nisargshah02/pen/eMXMGE?editors=1011

---

對於您的方法，我不太確定-即在localStorage中保持計數是否理想。 過去，我為此目的使用了Crosstab庫，事實證明它是可靠的。

---

注 ：這是一個不好的做法，通過財產類訪問訪問localStorge項目localStorage.tabCount 。 可能會遇到的常見問題之一是某個人會重寫系統方法，例如getItem或setItem 。

Answer 2

這樣，它適用於IE11和最新的firefox，chrome。 沒有檢查歌劇，邊緣，野生動物園或網景。

<script type="text/javascript">
    //only when an order is created
    var redirectFlag = false;
    if (+localStorage.tabCount > 0) {
        alert('Already a tab or window opened!');
        redirectFlag = true;
    } else {
        localStorage.tabCount = 0;
    }
    localStorage.tabCount = +localStorage.tabCount + 1;
    //works for firefox;chrome;ie11
    window.addEventListener('onpagehide', function (evt) {
        localStorage.tabCount = +localStorage.tabCount - 1;
    });
    //redirect user if there are 2 tabs/windows opened
    if (redirectFlag) {
        var baseUrl = window.location.origin;
        window.location.href = baseUrl + 'myurl';
    }
</script>