Question

Bug with Chrome's localStorage implementation?很好地解释了规范，以及它在Opera和IE9中的表现方式如何。

但是，现在呢？

这真的搞砸了我的代码（任何代码），它依赖于实现在浏览器上的一种方式，当它是另一种方式时。

如何测试以确定事件是否在调用它的窗口上触发？

我唯一可以想到的是使用setTimeout（）来等待并查看事件是否在调用它的窗口中触发，然后执行某些操作（如果没有）。但是，当快速连续调用存储事件时，这会产生一些可怕的错误。

在我的情况下，我需要为所有窗口触发事件，而不是除了调用它的所有窗口。在正确实现规范的Chrome中，这只是在添加到localStorage.setItem（）之后添加额外函数的问题，但是在IE，Firefox3.6和Opera中它将有效地执行两次。我也可能有基于浏览器的不同代码，但我应该测试兼容性而不是浏览器版本。

有没有办法用localStorage支持“修补”所有浏览器，让事件以相同的方式处理它们？

Answer 1

我解决了我自己的问题

var localStorageSpecCompliant = true;
var specCompliantTestVal = new Date().getTime();
function onStorage(ev) {
    if( ev.key == "specCompliantTest"+specCompliantTestVal ){
        localStorageSpecCompliant = false;
    }
    localStorage.removeItem("specCompliantTest"+specCompliantTestVal);
};
if( window.addEventListener ){  
    window.addEventListener("storage", onStorage, false);  
} else { window.attachEvent("onstorage", onStorage); }

localStorage["specCompliantTest"+specCompliantTestVal] = "This tests if the browsers localStorage storage event is spec compliant or ont.";

localStorage_setItem = function(key, value){
    localStorage[key] = value;
    if( localStorageSpecCompliant ){
        var dirtyFakeEvent = {"key":key, "newValue":value};
        onStorage(dirtyFakeEvent);
    }
}

但总是使事件工作相同的某种补丁会好得多。这种方式并不理想。我无法弄清楚如何伪造真正的“存储”事件，所以我直接调用了这个函数。

简单修复合规性的框架非常棒。我没有IE7中不存在localStorage的问题。但是在一个浏览器或另一个浏览器中完全不同的功能（与规范不同）是非常有问题的。

Answer 2

我对此很好奇并查看了几个js存储库。到目前为止我发现的支持存储事件的是YUI 2存储实用程序。看看它是否能够跨浏览器规范化行为将会很有趣。还有一个基于YUI3的库看起来很有趣，并宣传了一个变更事件和一个存储就绪事件。

YUI 2 Storage

YUI 3 based Storage Lite

这些可能涉及比您想要的更多依赖。他们还可以提供更简单地学习如何解决问题的方法。

这些图书馆还解决了如何处理不提供HTML5风格存储的浏览器的问题。

如何解释浏览器之间不同的“存储”事件行为？

2 个答案: