2011-09-15 20 views
6

Ecco il mio codice:localStorage EventHandler non viene chiamato

<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> 

Si inserisce con successo elementi nella memoria locale e il risultato mostra a 'results'-elemento, ma EventHandler non funziona. Aggiorna le finestre del browser e non vedo alcun messaggio di avviso. Perché?

+2

Cosa succede se si utilizza 'window.addEventListener ('storage', eventHandler, false)', piuttosto che 'addEL ('storage', eventHandler, false)'. –

risposta

12

Perché gli eventi di archiviazione non funzionano per la stessa finestra/scheda. Vengono attivati ​​solo per altre finestre/schede che utilizzano lo stesso localStorage. Prova ad aprire due separat tab e in un inserto alcuni dati allo localStorage.

Questo è un simile question che spiega come funziona l'evento localStorage.