2013-04-20 126 views
0

我想使用HTML5歷史記錄API和與<a>標記的經典鏈接。具有歷史記錄的瀏覽器後退按鈕API

我從/page1/開始,並使用ajax加載資源/recource/

然後我用window.history.pushState(push_data, document.title, url)推送歷史狀態。然後,我通過經典鏈接<a href = '/page2'>轉到另一頁,然後單擊瀏覽器中的後退按鈕。但是,而不是顯示頁面/page1/修改或不它顯示我的數據從/resource/頁 - 只是純文本數據或json或whatelse你有/rescource/

如何製作瀏覽器混合歷史記錄api和經典鏈接?

回答

0

它的確如你所做的那樣。

你是在:/page1這是對堆棧的頂部,然後推/resource,然後推 /page2。所以堆棧看起來像這樣。

/page2 
/resource 
/page1 

歷史API只允許開發人員推動的URL(和對象的一些數據),僅此而已......例如:如果你說你剛纔所創建的推進狀態動物的網頁google.com然後你將在堆棧google.com上,當點擊後退按鈕時,你會真正去google.com。

網絡上最重要的事情是URL代表了一些數據。現在你的榜樣鏈接的/resource網址有兩個不一樣的東西

  1. 的web頁面顯示的內容 - 所以當URL不工作或顯示不同的東西,你不應該推入歷史堆棧的/resource網址/resource
  2. /resource文件本身

但是他們是不一樣的! 這就是爲什麼你應該推這樣的東西,如/page1WithLoadedResource或(我認爲最好的)/page1/resourcepage1?loaded=resource或任何只是爲你工作,並確保這個URL做你想要什麼時,你只需要在瀏覽器中輸入它並不重要無論您服務於服務器還是客戶端...在客戶端上,您只能顯示空白頁面模板,然後通過AJAX加載/resource,與您在/page1上啓動並加載/resource時完全一樣。

你可以做到這一點使用一些客戶端的MVC/MVVM框架時,但走的更遠,從這個問題的範圍,但你應該總是與資源鏈接的網址書籤,加工,REST API和更容易得多,更多...