Javascript 实现location.hash双向绑定到AJAX记录上下文

我有一个简单的javascript AJAX应用程序，它允许搜索和选择记录。选择更新location.hash并加载关联的记录详细信息，理想情况下反之亦然（当哈希更改时加载记录）。当然，粗心的实现可能会导致循环和额外的面板闪烁

我想要这个双向绑定的可预测且简洁的实现

一种方法是仅在

hashchange

事件上加载记录，当在UI中选择记录时，设置

location.hash

。这看起来最简洁，但我担心这会降低使用轮询

hashchange

shim的旧浏览器中的记录点击响应

另一种方法是在选择记录时记录

导航

（例如）状态，并在处理

哈希更改

时清除该状态。那是我的书。然而，似乎某些事件序列，如快速回击多次，可能会导致显示的内容和URL之间的不一致

---

您见过解决这些问题的实现吗？

我认为在我的例子中有一个简单的答案，因为它是一个只读/幂等操作（实际上，它记录了一个视图）

我将只存储当前内容显示的状态，并在将加载内容的每个事件（包括“冗余”

hashchange

events）上对其进行测试，如果事件与当前显示的状态匹配，则忽略该事件

不管是好是坏，似乎很便宜。：）

以下是我的近似/伪代码：

var activeRecordId;
function loadHash() {
    var idList = window.location.hash.substring(1).split(',');
    if (idList.length > 1) loadSpecificRecordsToList(idList);
    else if (idList != '') loadDetailRecord(idList[0]);
}
function loadDetailRecord(id) {
    if (id != activeRecordId) {
        activeRecordId = id;
        doDetailLoadAjaxAndSuch(id);
    }
}
$(function () {
    loadHash();
    $.bind('hashchange', loadHash);
});

为什么不用呢？所有现代浏览器都支持它

为了简化工作，您可以使用历史/状态API

使用该库，您可以订阅URL更新

History.Adapter.bind(window, 'statechange', function () {
    // event handler code here
    var state = History.getState();
}

或者将新URL推送到历史记录中

History.pushState(null, "name", "http://newurl");

---

我不确定您希望使用哪个JS框架来获得双向绑定，但使用KnockoutJS，您可以使用读写方法创建ko.computed对象

问题完全相同，是吗？不支持

历史记录的客户端（包括IE9）如何响应记录选择？“2013年2月26日，Internet Explorer 10可供所有Windows 7 SP1用户下载。”-因此，特别是考虑到Windows 8的糟糕程度（并且是避免的），我认为在IE9上禁用核心功能是一个错误的选择。但也许我不明白你的建议是什么？对于使用较新技术的建议，库已经回退到hashtag for older Browser+1，但请注意问题仍然是一样的，因为在回退的情况下，它使用了原始问题中引用的技术。在旧浏览器中“降级”不重要的功能是一回事，但要确定它们根本不能点击详细链接，对我来说是不可能的。