1. 程式人生 > 實用技巧 >zuul實現模組異常統一攔截返回

zuul實現模組異常統一攔截返回

為什麼onunload對應的js程式碼不能執行?

為什麼onbeforeunload才可以在離開頁面時執行相應的js程式碼?

1.onunload和onbeforeunload都是在離開頁面或者重新整理頁面的時候才會呼叫的,他們是寫在body開始標籤裡面或者script中寫成window.onload或者window.onbeforeunload的樣子

2.onbeforeunload是伺服器去準備拿新的頁面呼叫的,onunload是已經到伺服器裡面拿到了新的頁面,替換當前的頁面時呼叫的

3.onbeforeload是在onunload之前呼叫的,也就是說你想要在頁面關閉時或者重新整理時看到想要的效果,就應該寫在onbeforeunload裡面,因為onunload是看不到效果的(我試了在谷歌,火狐,ie裡面來執行一個警告框程式碼),看不到這個效果,但是寫在console.log裡面確實是執行了onunload對應的js程式碼

4.頁面在載入中只呼叫onload事件

5.頁面在離開時的呼叫的順序是:先onbeforeload後onunload

6.頁面在重新整理的時候呼叫的順序:先onbeforeunload再onunload後onload

7.我認為的onunload呼叫,既然是新頁面替換當前頁面時才呼叫的話,那當前頁面的onunload對應的js程式碼應該是不被執行的,或者說是執行了但是由於替換成新的頁面了,所以就看不出效果,但是你想要檢驗的話,寫在conlose.log裡面是可以看到onunload事件有沒有被執行,是被執行的。

下面我檢測了火狐、谷歌、ie11版本對onunload事件的反應

上程式碼:

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title></title>
<style>p{cursor:pointer;}</style>
</head>
<body onload="load();" onbeforeunload="return fore()" >
<h2>視窗事件是針對於整個視窗而言</h2>
<p>onload事件控制程式碼和onunload事件控制程式碼直接寫在body內,寫在script中前面要加window</p>
<p onclick="alert('我在檔案載入之後,也就是開啟視窗之後等到頁面靜態資訊全部展示之後,做了單擊我這樣一個行為才有的效果');">單擊我</p>
<script type="text/javascript">
function load()
{alert("檔案載入時,歡迎訪問本頁面");} function ms()
{alert("當檔案關閉時或者跳轉到別的頁面時候的會觸發onunload事件控制程式碼");
}

window.onunload = function(){
console.log("退出時觸發");
20 } function fore()
{var message="確定離開";
return message;
26 } </script>
<a href="http://www.baidu.com">1</a> </body>
</html>

谷歌瀏覽器在重新整理的時候可以看到一瞬間的“退出時觸發”,然後消失

火狐在重新整理和跳轉頁面都可以看到“退出時觸發”

ie上面只有跳轉的時候才會觸發onunload

這裡說一下,像alert這些框寫在onunload裡面是看不到效果的,不知道是什麼原因?不知道可不可以這樣理解:因為onunload是在替換頁面時才呼叫的,所以原先的頁面的onunload對應的js程式碼就會被釋放,就看不到。但是寫在控制檯裡面是能夠看到效果的。onbeforeunload是在onunload之前被呼叫的