是否可以在单击“后退”按钮时保持（无需重新加载）AJAX 页面状态？

Question

我熟悉在各种情况下使后退按钮在 AJAX 应用程序中工作的几种方法，但我还没有找到在我的特定场景中可以正常工作的解决方案。

我正在使用的页面是网站的搜索界面。您在普通搜索框中输入术语，单击“转到”，然后出现搜索结果页面。在搜索结果页面上有大量的 UI 控件，用于对搜索结果进行过滤/排序以找到您要查找的内容。这些控件触发的某些操作可能需要（相对）较长的时间才能完成（例如几秒钟）。

如果用户最初对其结果进行过滤/排序，那么这种延迟就很好......还有一个不错的 AJAX 旋转器等等......但是，当用户单击搜索结果然后单击“后退”按钮时，我希望页面立即恢复到他们单击时的状态。

我可以使用 IFRAME/片段标识符作为页面历史记录字典来恢复状态，但最终发生的情况是，当用户第一次点击后退按钮时，会加载初始页面，然后它（重新）进行 AJAX 查询以获取页面状态返回，这会触发 AJAX 旋转器并可能再次等待几秒钟。

当用户通过“后退”按钮返回页面时，是否有任何方法不需要这种页面的两阶段加载？

编辑添加：我偏爱 jquery，但我对依赖其他库/工具包或独立/原始 javascript 的解决方案感到满意。

编辑添加：我应该补充一点，我正在尝试避免 cookie/会话，因为这可以防止人们打开多个浏览器窗口/选项卡并同时操作不同的搜索结果集。

编辑：马特，您能否详细说明您提出的解决方案（通过片段标识符触发页面更改事件）？我看到这将如何帮助单击同一页面上的“后退”按钮，但在单击特定结果后不会返回到搜索结果页面。

Answer 1

尝试使用 本地存储 目的。这是跨浏览器库 j存储 和 WEBSHIMS json 存储

Answer 2

只需使用一个 曲奇饼.

Answer 3

你有没有调查过 YUI 浏览器历史记录管理器?

Answer 4

使用“向 URL 末尾的 # 添加一些信息”方法是否有助于触发页面更改事件？

这样，单击后退按钮实际上不会更改页面，并且您应该能够在不加载第一页的情况下恢复状态。

Answer 5

使用与用户个人资料相关的持久内容。

Cookie 和会话是好主意，但您也可以将这些内容保存在数据库中。这为您提供了一个额外的优势，即能够在不同的浏览会话中保存用户的过滤首选项。（例如，如果他在办公室寻找某些东西，然后决定在回到家后继续搜索）。

这一切都取决于过滤器的复杂性和天气，您是否认为用户会希望在不同的浏览会话中使用它。

Answer 6

编辑添加：我应该补充一下 我正在尝试避免 cookie/会话 因为这可以防止人们有 打开多个浏览器窗口/选项卡，并 操作不同的搜索集 结果。

您可以创建一个随机令牌并将其分配给片段标识符。

• 如果未设置片段标识符，则在第一页加载时创建一个令牌
• 在导航出去之前，将所有临时 ajax 数据存储在 cookie 中，并以该令牌作为索引。
• 回击时，如果设置了片段标识符，则从 cookie 中相应的 token 加载数据。
• 您甚至可以添加“时间”字段来使令牌过期，等等......

示例 cookie (JSON)：

{"ajaxcache":[{"token":<token>,"time":<time>,"data":<data>}, ... ]}