如何實現類似Facebook的麪包屑導航？

Question

我正在嘗試製作一個使用麪包屑的Ajax Web應用程序，以允許使用後退和前進按鈕，但仍然有那種光滑的ajax頁面移動。

一個很好的例子是Facebook的圖片庫。

當您單擊「下一步」時，URL會變爲相應的URL，但整個頁面不會更新。這是一個非常流暢的界面，我想模仿它。

任何人都有一個教程/寫這如何工作？

感謝。

Answer 1

Facebook使用URL-Anchor-Identifier來存儲他們的AJAX代碼所需的代碼。這允許在不重新加載網站的情況下更改URL。

例子：http://somedomain.com/#ajax_data_here

現在是給你寫一個聰明的格式，爲您AJAX數據和分析數據。

---

更新2012年12月：

我最近遇到了改變URL中的路徑無需重新加載下面的方法。雖然只有較新的瀏覽器上運行，我想我會追加它：

• Modify the URL without reloading the page

Answer 2

據我所知，有一些這樣的效果，實現方式主要有兩種：

1. 使用URL（#gallery）的錨定部分
2. 使用隱藏的iframe

您可以使用預構建的解決方案來利用此類功能，而無需處理編寫代碼。例如，如果您正在使用asp.net的工作，那麼你可以使用Ajax的歷史記錄控制：

• http://www.asp.net/ajax/videos/how-do-i-use-the-aspnet-ajax-history-control

Answer 3

如果您正在使用JQuery，看看地址插件。

http://www.asual.com/jquery/address/

Answer 4

如果你使用jQuery，有很多的建議記錄在這裏：https://stackoverflow.com/questions/116446/what-is-the-best-back-button-jquery-plugin

我個人使用jQuery的Address，這是超級簡單，非常有效。