1. 程式人生 > >(仿錨點) 實現 頁面前進後退,重新載入 滾動條停留在原來的位置上

(仿錨點) 實現 頁面前進後退,重新載入 滾動條停留在原來的位置上

處理機制是 cookie 和 onbeforeunload()方法的呼叫

window.onbeforeunload = function() {
    var scrollPos;
    if (typeof window.pageYOffset != 'undefined') {
        scrollPos = window.pageYOffset;
    } else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') {
        scrollPos = document
.documentElement.scrollTop; } else if (typeof document.body != 'undefined') { scrollPos = document.body.scrollTop; } document.cookie = "scrollTop=" + scrollPos; } window.onload = function() { if (document.cookie.match(/scrollTop=([^;]+)(;|$)/) != null) { var arr = document
.cookie.match(/scrollTop=([^;]+)(;|$)/); //cookies中不為空,則讀取滾動條位置 document.documentElement.scrollTop = parseInt(arr[1]); document.body.scrollTop = parseInt(arr[1]); } }

頁面載入時只執行onload
頁面關閉時只執行onunload
頁面重新整理時先執行onbeforeunload,然後onunload,最後onload。