在onbeforeunload中使用Ajax自動保存字段數據

我想在window.onbeforeunload函數中使用AJAX來自動保存在我的網站中的頁面上的文本字段（沒有保存按鈕，它全部在後臺完成）。保存功能是用PHP編寫的。我開始嘗試以下：在onbeforeunload中使用Ajax自動保存字段數據

window.onbeforeunload = function(e){ 
    var noteelement = document.getElementById('note'); 
    var mynote = noteelement.value; 

    $.post('save_my_note.php', { thenote: mynote }, function(data){}); 
    };

在研究中，我認識到，由於Ajax調用的異步特性，PHP代碼不被調用，因爲窗口的功能火災之前從封閉服務器。

當然，正如其他人所說，如果我將一個返回值添加到onbeforeunload函數，導致對話框彈出（這將是「你確定要離開」框），它工作以來該呼叫.post的有時間去運行，而對話框等待響應：

$.post('save_my_note.php', { thenote: mynote }, function(data){}); 
    return mynote; 
    };

有人說，我有這樣的功能等待功能來改變這個帖子調用AJAX異步完整的，但不是非常精通語法，我不太清楚我需要的語法。我嘗試以下代替帖子功能：

 $.ajax({ 
      url: "save_my_note.php", 
      data: "{thenote: mynote}", 
      async: false     
     });

但是，這似乎並不工作。

有沒有人有一個簡單的代碼示例通過onbeforeunload（或onunload ??）函數以同步方式實現自動保存？我不是一個JavaScript或jQuery專家，我在網上找到的例子一直令人困惑。

來源

2012-01-03 Ben Cahan

您的意思是在最後的代碼片段中鍵入'async：false'嗎？ – Ivan 2012-01-03 21:47:35

看到這個問題的答案：http://stackoverflow.com/questions/2970782/javascript-wait-until-ajax-request-finishes-to-close-page – Ivan 2012-01-03 21:49:30

請注意，onbeforeunload不會在移動瀏覽器觸發，所以如果你也適合移動市場，你可能需要以不同的方式處理事情 – 2012-07-10 09:51:31

也許你可以強制超時暫停 - 不知道這是否會實際工作，只是一個猜測：

var bSaved = false; 
window.onbeforeunload = function(e){ 
    bSaved = false; 
    var noteelement = document.getElementById('note'); 
    var mynote = noteelement.value; 

    $.post('save_my_note.php', { thenote: mynote }, function(data){ bSaved = true; }); 

    window.setTimeout('bSaved = true',2000); 

    while (!bSaved) {} 

    };

來源

2012-01-03 21:48:52

我讀過將它改爲ajax並使用async：true應該導致服務器端代碼暫停並等待它完成之前繼續前進，但我無法讓它工作。超時很可能是偶然的，並且無論如何會在他們關閉之前爲我的所有頁面添加強制等待時間。 – 2012-01-03 21:53:46

這不是我投入的強制性時間，而是最大超時時間。一旦服務器返回，頁面將立即卸載，或者在兩秒鐘內，以先到者爲準。 – 2012-01-03 21:57:13

@MattH超時（和成功回調）將永遠不會被解僱，因爲它會永久留在while循環中。 – Paul 2013-02-11 21:25:03

你的最後一個例子應該工作，你需要改變asynch: false到async: false（額外^h必須刪除）according to jQuery documentation

來源

2012-01-03 21:52:25 Tony

在onbeforeunload中使用Ajax自動保存字段數據

回答

相關問題