事件的起因是由于在工作中有客戶(hù)反映，常常會(huì)有用戶(hù)在瀏覽網(wǎng)頁(yè)的過(guò)程中訂購(gòu)了商品，但是由于用戶(hù)一下子打開(kāi)的窗口過(guò)多，又或者在敲打鍵盤(pán)時(shí)，錯(cuò)誤地按到了F5鍵，導(dǎo)致頁(yè)面刷新或者不正常關(guān)閉，而這時(shí)在該網(wǎng)頁(yè)上所做的一切操作的信息都丟失了，如果我們可以提供一個(gè)在客戶(hù)信息未處理完成時(shí)的提示那該多好啊，下面的代碼可以做到不管用戶(hù)是點(diǎn)擊了關(guān)閉，或者是在任務(wù)欄關(guān)閉、點(diǎn)擊后退、刷新、按F5鍵，都可以檢測(cè)到用戶(hù)即將離開(kāi)的消息。 復(fù)制代碼 代碼如下: script type='text/javascript' language='javascript' function bindunbeforunload() { window.onbeforeunload=perforresult; } function unbindunbeforunload() { window.onbeforeunload=null; } function perforresult() { return'當(dāng)前操作未保存，如果你此時(shí)離開(kāi)，所做操作信息將全部丟失，是否離開(kāi)?'; } /script 只需要將bindunbeforunload()方法注冊(cè)到要檢測(cè)的頁(yè)面上即可，你可以在body的onload或者document.ready中注冊(cè)這個(gè)方法，在這里我們采用的是window.onbeforeunload，即是在頁(yè)面即將卸載之前彈出提示框，好的，現(xiàn)在來(lái)測(cè)試一下，測(cè)試代碼： 復(fù)制代碼 代碼如下: html headtitlethis is id onbeforunload event test/title /head script type='text/javascript' language='javascript' function bindunbeforunload() { window.onbeforeunload=perforresult; } function unbindunbeforunload() { window.onbeforeunload=null; } function perforresult() { return'當(dāng)前操作未保存，如果你此時(shí)離開(kāi)，所做操作信息將全部丟失，是否離開(kāi)?'; } /script body onload='javascript:return bindunbeforunload();' h1test is start/h1 input type='button' value='綁定事件' onclick='return biindunbeforunload();'/ input type='button' value='刪除綁定事件' onclick='unbiindunbeforunload();'/ /body /html 上面的代碼就是我此次測(cè)試的所有代碼了，現(xiàn)在刷新頁(yè)面，嗯，很好，彈出了我們期望中的對(duì)話(huà)框。但是當(dāng)我在IE下打開(kāi)上述代碼時(shí)，我的“刪除事件綁定按鈕”沒(méi)有發(fā)揮作用，這讓我很崩潰，國(guó)內(nèi)3分之2的用戶(hù)都在使用IE，特別是在使用該死的IE6、7，如果我的代碼不能在IE6、7下正常的工作，那相當(dāng)于我的工作是白做了，當(dāng)然，獎(jiǎng)金的那些事情就更不用想了。辦法都是人想出來(lái)的，好吧，我利用一個(gè)全局變量來(lái)控制是否彈出對(duì)話(huà)框，修改后的'javascript'代碼如下： 復(fù)制代碼 代碼如下: script type='text/javascript' language='javascript' var goodexit=false; function bindunbeforunload() { goodexit=false; window.onbeforeunload=perforresult; } function unbindunbeforunload() { goodexit=true; window.onbeforeunload=null; } function perforresult() { if(!goodexit) { return'當(dāng)前操作未保存，如果你此時(shí)離開(kāi)，所做操作信息將全部丟失，是否離開(kāi)?'; } } /script 同時(shí)調(diào)用刪除綁定事件時(shí)，將變量goodexit的值更改為：true，表示用戶(hù)是正常退出，這樣自然不會(huì)彈出對(duì)話(huà)框了。 再測(cè)試一下，正常了，對(duì)，這就是我想要的結(jié)果！ 本篇文章源于從Brandon Himes處而得，并且還是從google快照，源文鏈接已找不到，本來(lái)想翻譯的，但是本人水平實(shí)在有限，看得懂而已，如果翻譯得不好反而招罵，如果朋友們想看源文，請(qǐng)直接點(diǎn)擊這里，這是快照地址，可能一段時(shí)間后就不存在了。您可能感興趣的文章:onbeforeunload與onunload事件異同點(diǎn)總結(jié)判斷用戶(hù)的在線狀態(tài) onbeforeunload事件使用onbeforeunload屬性后的副作用關(guān)閉瀏覽器時(shí)提示onbeforeunload事件