这是我的代码:
<script type="text/javascript"> function getLocalStorage() { try { if (!! window.localStorage) return window.localStorage; } catch(e) { return undefined; } } function getAddEventListener() { try { if( !! window.addEventListener ) return window.addEventListener; } catch(e) { return undefined; } } function eventHandler(e) { alert("here we are = " + e.storageArea.traveler); } function testStorage() { var db = getLocalStorage(); var addEL = getAddEventListener(); if(addEL) { addEL('storage',eventHandler,false); } else { alert('This browser does not support event listeners'); } db.setItem('traveler','Bill'); db.setItem('destination','Ventura'); db.setItem('transportation','Airplane'); document.getElementById('results').innerHTML = db.getItem('destination'); } </script> </head> <body onload="testStorage();"> <div id="results"> </div> </body> </html>
它成功地在本地存储中插入项目并在’results’-element中显示结果,但eventHandler不起作用.我刷新浏览器窗口,看不到任何警报消息.为什么?
解决方法
因为存储事件不适用于同一窗口/选项卡.它们仅针对使用相同localStorage的其他窗口/选项卡触发.尝试打开两个单独的选项卡,并在一个插入一些数据到localStorage.
这是一个类似的question,解释了localStorage活动的工作原理.