關閉頁面時的觸發條件網上很多,但是幾乎沒有真正好用的,但是基本思路都是用window.onbeforeunload來實現,但是由於瀏覽器的版本不同,是否支援小頁簽,重新整理和關閉都會調用onbeforeunload和onunload方法,導致大部分網上的資料都不能有效判斷當前頁面是重新整理還是關閉。
以下方法,至少ie6,ie7,ie8支援
window.onbeforeunload=function()
{
if((event.clientX > document.body.clientWidth-20 && event.clientY<0) || (!(event.clientY<-30)&& (event.clientY <0))|| event.altKey)
{
alert("關閉頁面");
}
else{
alert("重新整理頁面");
}
}
這個方法中if條件沒有判斷按鍵F5重新整理,如果需要可以自己添加,因為系統要求屏蔽F5按鍵重新整理的,所以我不做考慮。
其實這個方法很簡單,原則就是判斷滑鼠的位置:
event.clientX:滑鼠在IE中的X軸位置
event.clientY:滑鼠在IE中的Y軸位置
document.body.clientWidth:用戶端IE寬度
當點擊IE右上方的紅叉的時候,用(event.clientX > document.body.clientWidth-20 && event.clientY<0)來判斷,其中event.clientX > document.body.clientWidth-20 表示滑鼠在IE關閉按鈕紅叉豎著的這一列,event.clientY<0又表示滑鼠的位置在IE的上面,所以能判斷出是點擊關閉的操作;同時(!(event.clientY<-30)&& (event.clientY <0))是對IE7、8等有小頁簽來做判斷的,表示滑鼠在IE的上面有小頁簽的這一排做的操作,這一排是沒有重新整理按鈕的,所以可以判斷是點的關閉小頁簽。
這個方法對遨遊無效,其他瀏覽器沒有做驗證,有人做過驗證的話希望能完善這個方法。