Seemingly inconsistent onstorage triggering in Safari
I've encountered the following issue in the Safari 5.0 (not in all WebKit-based browsers), this code:
<html>
<script>
var onstorage = function(evt) {
alert([evt.key, evt.oldValue, evt.newValue].join('\n'));
}
var onclick = function(evt) {
localStorage.setItem('test', Math.random());
}
var oninit = function() {
//actually, it works the same way with old "plain event" onclick
document.querySelector('#test').addEventListener('click', onclick, false);
window.addEventListener('storage', onstorage, false);
}
</script>
<body onload="oninit()">
<input id="test" type="button" value="setting a random value"/>
</body>
will trigger on alert, in case we click the button. While this code -
<html>
<script>
var onstorage = function(evt) {
alert([evt.key, evt.oldValue, evt.newValue].join('\n'));
}
var onclick = function(evt) {
localStorage.setItem('test', Math.random());
}
var oninit = function() {
window.addEventListener('storage', onstorage, false);
//actually, it works the same way with old "plain event" onclick
document.querySelector('#test').addEventListener('click', onclick, false);
}
</script>
<body onload="oninit()">
<input id="test" type="button" value="setting a random value"/>
</body>
trig开发者_如何转开发gers few alerts, as not expected. I do think this is a bug, but can't somebody explain me - why swapping just two lines of codes results in such a weird behaviour?
There is no bug (although like others have commented I would not name the event handlers as global functions with names that might confuse).
The issue is how the notifications for localStorage work. In essence, events are only fired for other windows (or tabs) that use the same localStorage.
Here's a similar question and answer here on StackOverflow.
So, in your example, the storage changed event won't fire: the handler is on the same page.
加载中,请稍侯......
精彩评论