Question

我需要在localStorage更改时收到通知。此代码在Firefox 24中运行良好，但在Chrome 29（或30）或IE 10中不起作用。它也适用于实时服务器，但在我使用本地文件（file:///）进行测试时无效

以下是代码：

<!DOCTYPE html>
<html>
<head>
    <title>Index</title>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#submit').click(function() {
                console.log('Clicked');
                if($('#username').val() != "")
                    localStorage.setItem('someItem', 'someValue');
            });
            $(window).bind('storage', function(e) {
                alert('change');
            });


        });
    </script>
</head>
<body>
<input type="text" id="username" name="username" value="" />
<a href="#" id="submit">Click me</a>
<p id="result"></p>
</body>
</html>

Chrome中有什么问题？我根据需要打开两个标签。

Answer 1

它只会触发＆＃34;其他＆＃34;标签/窗口，但没有更改数据（这在您的问题中有点不清楚，所以如果我误解，请纠正我。）

当调用setItem（），removeItem（）和clear（）方法时存储对象x与本地存储区域相关联，如果是方法做了一些事情，然后在每个Document对象的Window中对象的localStorage属性与存储对象相关联相同的存储区域除x 之外，必须触发存储事件，如下所述。

Source W3C

更新以根据评论完成答案：

如果页面由于安全原因从文件协议（file:///）运行，某些浏览器会有限制。

在Chrome中，您可以通过提供参数--allow-file-access-from-files：

来覆盖它

chrome.exe --allow-file-access-from-files

我不确定您是否可以与其他浏览器做类似的事情。我建议使用本地服务器（例如Mongoose）进行测试，以免在实时场景中遇到任何意外。

localStorage事件侦听器不会在Chrome中为本地文件触发

1 个答案: