十分鐘內學會：控制瀏覽器是否緩存網頁狀態

作者: Cat Chen 來源: 博客園發布時間: 2009-11-03 10:42 閱讀: 2307 次推薦: 0 原文鏈接 [收藏]

　　Question

　　在Firefox等瀏覽器中，如果你打開一個頁面并進行若干操作，例如在文本框進行輸入，甚至點擊按鈕進行Ajax操作更新頁面局部，這些操作的結果都會被緩存下來。在你點擊鏈接離開這個頁面后，如果你通過后退按鈕回到這個頁面，你會發現它仍出于你離開時的狀態，而非頁面剛剛加載好后的初始狀態。在一些情況下，這樣的緩存方式是符合我們預期的；但在另外一些情況下，我們更希望頁面恢復到初始狀態，或者說讓頁面從零開始重新加載一邊。我們如何才能讓瀏覽器尊重我們的選擇呢？

　　Answer

　　如果你只是希望頁面不緩存加載后的變更，后退就恢復到最初加載的狀態，你只需要一個空白的unload事件就可以了：

　　window.onunload = function(){};

　　其中的原理是，Firefox等瀏覽器會嘗試通過“掛起（suspend）”的方式來緩存頁面，使得后退能夠恢復到頁面之前被掛起那一刻的狀態。然而如果unload事件有處理函數，瀏覽器就認為你可能已經對頁面進行了析構處理，這時候頁面已經不可能回到正常的交互狀態，也就不能以掛起的方式來緩存頁面。

　　如果我們希望允許瀏覽器掛起頁面，同時又需要知道何時被掛起何時被恢復，那該怎么辦呢？我們可以用window對象上的pageshow和pagehide事件。當頁面被掛起并隱藏時，pagehide事件會被觸發；當頁面被恢復到掛起前狀態并顯示出來時，pageshow事件會被觸發。Firefox從1.5開始就支持這兩個事件，Safari最新的nightly build也支持這兩個事件。