为什么 Internet Explorer 有时会在数据准备好之前触发本地存储事件？ [复制]

【问题标题】：Why does Internet Explorer sometimes trigger a local storage event before the data's ready? [duplicate]为什么 Internet Explorer 有时会在数据准备好之前触发本地存储事件？ [复制]
【发布时间】：2013-08-16 11:33:40
【问题描述】：

Internet Explorer 10 有时会在访问新值之前触发窗口“存储”事件。我有一个“存储”事件的侦听器，它对设置的新数据做出反应，但有时无法访问它。这尤其成问题，因为侦听器无法对实际的新数据做出反应。

为什么会出现这个问题，我可以做些什么来解决它？

【问题讨论】：

Explorer 在向存储提交新值时已经触发了一个事件。我发现它在我的 IE 11 中触发了 3 次 - 当旧值为 null 时，当新值为 null 时，然后将新值全部存储到存储中。我的解决方法是让监听器进入 setTimeout，我有一秒钟的时间，IE 不再第一次触发它（第一个窗口）。并且当它从另一个窗口触发时，它会获得正确的数据。

标签： javascript html local-storage

【解决方案1】：

此问题已在此处提出：localStorage.getItem returns old data in IE 9

这是我在 IE10 中测试并希望在 IE8 和 IE9 中同样工作的解决方案：

首先，我的 javascript 组件不直接侦听窗口“存储”事件，而是侦听我创建的“事件调度程序”。事件分派器监听窗口“存储”事件并触发主干事件。我所做的是将我的 eventDispatcher 的存储事件触发器延迟足够长的时间让 IE 赶上。使用 Underscore.js 的 defer() 方法，我能够在浏览器之间获得一致的行为，而不会影响用户体验。

这是我的 dispatchStorageEvent() 方法的样子：

$(window).on('storage', dispatchStorageEvent);
function dispatchStorageEvent(event) {
  _.defer(function() {
    var originalEvent = JSON.parse(event.originalEvent);
    ...
    eventDispatcher.trigger("storageEvent:" + originalEvent.key, originalEvent.newValue);
  }, event);
}

【讨论】：