onbeforeunload僅執行一次

Question

我使用onbeforeunload通過Ajax請求重置變量。但它只執行一次。例如，如果我訪問該頁面（登錄後）並關閉該窗口，則會執行該功能，但如果我重複該操作（將地址放入瀏覽器並完成登錄並關閉窗口），則不會執行該功能。

window.onbeforeunload = function (e) { 
    //Ajax request to reset variable in database 
    resetDemoValueWithAjax(); 
}; 

//Ajax request to reset variable in database and exit 
function resetDemoValueWithAjax(){ 
    $.ajax({ 
     async:true, 
     type: "POST", 
     dataType: "json", 
     url:"http://localhost/site/index.php/welcome/resetDemoValue", 
     data: {name: "demo"}, 
     success:function(){ 
      document.location.href='http://localhost/site/index.php/auth/logout'; 
     }, 
     error: function(){ 
      document.location.href='http://localhost/site/index.php/auth/logout'; 
     } 
    });  
} 

document.location.href='http://localhost/site/index.php/auth/logout';僅在另一時刻使用：當用戶註銷時。不在這裏

Answer 1

您有race condition。異步Ajax請求與瀏覽器嘗試從頁面導航（這首先導致beforeunload）之間的比賽。離開的導航可能總會贏，所以瀏覽器在Ajax回調完成之前離開頁面。

如果您使得Ajax請求與async:false同步，則不會發生此比賽，因爲在解決Ajax請求之前JavaScript線程會阻塞。請注意，這會導致潛在的惱人的用戶體驗（即，用戶嘗試關閉頁面，但必須等待Ajax請求在標籤關閉之前解析）。