jquery - How to bind to localStorage change event on different pages of the same site? -
i know how bind change event localstorage if same page opened in 2 tabs (this topic) , need similar effect, if had 2 pages of 1 site opened in different tabs. ideas?
make example you， check want?
http://www.yoursite.com/page1.html
<html> <head> <title>page 1</title> </head> <body> <input type="text" id="value"/> <button id="save">save</button> </body> <script> function $id(id){ return document.getelementbyid(id); } function addhandler(ele,trigger,handler){ if(window.addeventlistener){ ele.addeventlistener(trigger,handler,false); return false; } window.attachevent(trigger,handler); } function savetostorage(){ var value = $id('value').value; window.localstorage.setitem('key',value); } addhandler($id('save'),"click",savetostorage); </script> </html> http://www.yoursite.com/page2.html
<html> <head></head> <body> value: <span id="value"></span> </body> <script> function addhandler(ele,trigger,handler){ if(window.addeventlistener){ ele.addeventlistener(trigger,handler,false); return false; } window.attachevent(trigger,handler); } function onstoargeevent(e) { var value = localstorage.getitem('key'); console.log('successfully communicate other tab'); console.log('received data: ' + value); document.getelementbyid('value').innertext = value; } addhandler(window,"storage",onstoargeevent); </script> </html>
Comments
Post a Comment