localStorage事件监听器没有被调用
我向窗口 DOM 对象添加了一个 eventListener,并希望跟踪对 localStorage 所做的更改。
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script language="JavaScript"><!--
window.addEventListener('storage', storageEventHandler, false);
function storageEventHandler(evt){
console.log("oldValue: " + evt.oldValue );
console.log("storage event called key: " + evt.key );
console.log("newValue: " + evt.newValue );
}
$(document).ready(function(event) {
$('#link1').click(function(event){
event.preventDefault();
localStorage.setItem('page', 2000);
console.log(localStorage.getItem('page'));
});
$('#link2').click(function(event){
event.preventDefault();
localStorage.setItem('page', 998);
console.log(localStorage.getItem('page'));
});
});
</script>
</head>
</html>
不知何故,即使当我单击 link1 或 link2 时 localStorage 值发生更改, storageEventHandler 也永远不会被调用。 非常感谢任何帮助。
I added an eventListener to the window DOM-Object and want to keep track of the changes made to localStorage.
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script language="JavaScript"><!--
window.addEventListener('storage', storageEventHandler, false);
function storageEventHandler(evt){
console.log("oldValue: " + evt.oldValue );
console.log("storage event called key: " + evt.key );
console.log("newValue: " + evt.newValue );
}
$(document).ready(function(event) {
$('#link1').click(function(event){
event.preventDefault();
localStorage.setItem('page', 2000);
console.log(localStorage.getItem('page'));
});
$('#link2').click(function(event){
event.preventDefault();
localStorage.setItem('page', 998);
console.log(localStorage.getItem('page'));
});
});
</script>
</head>
</html>
Somehow the storageEventHandler is never called even though the localStorage value is changed when I click link1 or link2.
Any help is much appreciated.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
某些浏览器不支持存储事件,并且大多数支持它的浏览器只会当不同窗口/选项卡更改存储时调用它。因此,在两个窗口中打开您的页面。单击一个窗口中的链接,您可能会在另一个窗口中看到该事件。
假设您的页面已经知道其自己的窗口中与 localStorage 的所有交互,并且仅在不同的窗口更改内容时才需要通知。当然,这是一个愚蠢的假设。但是,localStorage 是一个新事物。希望他们最终能弄清楚这一切。
Some browsers don't support the storage event, and most of the browsers that do support it will only call it when the storage is changed by a different window/tab. So, open your page up in two windows. Click the links in one window and you will probably see the event in the other.
The assumption is that your page will already know all interactions with localStorage in its own window and only needs notification when a different window changes things. This, of course, is a foolish assumption. But, localStorage is a new thing. Hopefully, they'll eventually figure it all out.
storage
事件处理程序只会影响其他窗口。每当localStorage
内的一个窗口发生某些变化时,所有其他窗口都会收到通知,并且如果需要采取任何操作,可以通过侦听storage
的处理函数来实现事件。对于同一窗口,您必须在调用
localStorage.setItem()
后手动调用storageEventHandler
函数才能在同一窗口中实现相同的行为。The
storage
event handler will only affect other windows. Whenever something changes in one window insidelocalStorage
all the other windows are notified about it and if any action needs to be taken it can be achieved by a handler function listening to thestorage
event.For same window you have to manually call the
storageEventHandler
function afterlocalStorage.setItem()
is called to achieve the same behaviour in the same window.