欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

分享JavaScript獲取網(wǎng)頁關(guān)閉與取消關(guān)閉的事件

 更新時間：2013年12月13日 15:17:21   作者：  
這篇文章主要介紹了JavaScript獲取網(wǎng)頁關(guān)閉與取消關(guān)閉的事件，有需要的朋友可以參考一下

在做Web開發(fā)時，我們經(jīng)常用到頁面關(guān)閉事件onbeforeunload，可以給用戶一個選擇放棄關(guān)閉的機會，就比如這個博客編輯器。如果用戶選擇了離開，那么onunload事件自然會觸發(fā)；但若用戶選擇了取消，又該如何檢測呢？

我們假定一個頁面離開取消事件，叫做onunloadcancel。顯然，這個事件應(yīng)觸發(fā)在用戶按下對話框的取消按鈕之后。但關(guān)閉提示對話框的觸發(fā)流程并不是那么簡單。我們先來回顧下這個過程：

復(fù)制代碼 代碼如下:

window.onbeforeunload = function()
{
    return "真的離開?";
}

當用戶準備離開頁面（比如按下關(guān)閉按鈕，或者刷新頁面等等），onbeforeunload事件觸發(fā)。我們的腳本無法在這個事件里決定是否阻止頁面的關(guān)閉，唯一能做到的只有返回一個字符串，這個字符串僅作為說明文字出現(xiàn)在關(guān)閉選擇對話框里，用戶可以選擇關(guān)閉，或者不關(guān)閉。但究竟選擇哪個，我們無從得知。

然而仔細分析下這個問題，其實不然。 如果用戶真選擇了關(guān)閉頁面，那么之后所有的運行代碼都byebye了；而繼續(xù)留在頁面的話，就當什么都沒發(fā)生過，除了onbeforeunload事件。所以，我們在onbeforeunload事件里做點小花招，在此注冊個幾毫秒之后啟動的定時器，如果頁面真關(guān)閉了，那么這個定時器當然是作廢了；那么頁面還在，幾毫秒的延時對于這個本來就是異步的界面交互事件也沒有什么誤差。

復(fù)制代碼 代碼如下:

<script language="JavaScript">
window.onbeforeunload = function()
{
    setTimeout(onunloadcancel, 10);
    return "真的離開?";
}
window.onunloadcancel = function()
{
    alert("取消離開");
}
</script>

我們使用setTimeout，延時10ms執(zhí)行onunloadcancel。如果頁面真關(guān)閉了，定時器當然都銷毀；反之繼續(xù)。但在測試中，發(fā)現(xiàn)FireFox有個兩個BUG：

有時按下關(guān)閉按鈕，也會執(zhí)行onunloadcancel，并且有個對話框一閃而過。如果換成while(1);瀏覽器會一直卡死，這說明onunloadcancel確實是執(zhí)行了，只是銷毀了界面，但并沒有暫停腳本的運行。
如果是通過刷新頁面的方式離開，僅執(zhí)行一次onbeforeunload，但點擊X按鈕關(guān)閉頁面，會執(zhí)行兩次onbeforeunload。因此我們還需在完善下，以便兼容FF。

復(fù)制代碼 代碼如下:

<script language="JavaScript">
var _t;
window.onbeforeunload = function()
{
    setTimeout(function(){_t = setTimeout(onunloadcancel, 0)}, 0);
    return "真的離開?";
}
window.onunloadcancel = function()
{
    clearTimeout(_t);
    alert("取消離開");
}
</script>


這里使用了一種我也說不出原因的辦法，應(yīng)該算是hack，解決了FF下的bug。

相關(guān)文章

最新評論