讓Ajax網頁帶有後退功能

< DOCTYPE html PUBLIC -WCDTD XHTML StrictEN httpwwwworgTRxhtmlDTDxhtml-strictdtd>

讓Ajax網頁帶有後退功能

在AJAX 做了一個項目後，測試人員告訴我，新聞清單翻了很多頁後，當檢視過一條新聞的詳細資訊傳回目錄的時候，不能傳回到已經翻過的頁碼，而要從第一頁重新翻，這樣很郁悶。網上面找到一篇<開發保留标準浏覽器功能的AJAX應用程式>的文章，按照裡面的介紹，把相應的代碼節選出來，保留在這裡。

我實作原理是：每翻一次頁，把目前的頁碼存入碎url的碎片辨別中，待客戶檢視完詳細資訊後傳回到目錄，在目錄的body的onload事件執行setOptionValue，将碎片的内容擷取下來，再執行讀取目錄的函數；以達到儲存翻頁資訊的功能。

//使用URI的碎片辨別符部分，建立狀态的曆史記錄；

function makeHistory(newHash)

{

window.location.hash = newHash;

expectedHash = window.location.hash;

alert(expectedHash);

return true;

}

//檢查浏覽器曆史記錄中的URI

function handleHistory()

if ( window.location.hash != expectedHash )

     alert(window.location.hash + "|" + expectedHash);

    expectedHash = window.location.hash;

    var newoption = expectedHash;

    setOptionValue( newoption );

function pollHash() {

handleHistory();

//window.setInterval("handleHistory()", 1000);

//擷取碎片中的内容，可進行任何操作

function setOptionValue(value)

// var myForm = document.make_history;

// var mySelect = myForm.change_year;

// mySelect.options[value-1].selected = true;

    document.getElementByIdx("testDiv").innerHTML = value.replace('#','');

    Test(value.replace('#',''));

    alert(value.replace('#',''));

本文轉自 netcorner 部落格園部落格，原文連結：http://www.cnblogs.com/netcorner/archive/2007/07/20/2912332.html  ，如需轉載請自行聯系原作者