2011-01-04 3 views
2

L'événement qui doit être déclenché lorsque localStorage est modifié semble manquer d'informations dans Firefox.Propriétés non définies dans l'événement 'storage' de localStorage

Je mis en place le gestionnaire d'événement suivant:

function storageEventHandler(e){ 
     alert("key " + e.key); 
     alert("oldValue " + e.oldValue); 
     alert("newValue " + e.newValue); 
     alert("url " + e.url); 
} 

window.addEventListener('storage', storageEventHandler, false); 

qui devrait être déclenchée par ceci:.

localStorage.setItem('foo', 'bar');

Cependant, toutes les propriétés en cas (par exemple e.key et tout le reste) sont tous indéfinis. J'utilise Firefox 3.16. Pourquoi les propriétés de l'événement sont-elles indéfinies?

EDIT. Voici tout le code que j'utilise. L'événement se déclenche de stockage dans Firefox 3.16 mais pas dans Firefox 4.0b8

aussi important, je le suis en cours d'exécution de XAMPP http://localhost/index.html exécuter à partir file: // faire mourir localStorage Getting NULL?

<!DOCTYPE html5> 
<html lang="en"> 
<head> 
    <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
    <script> 
     $(function() { 
      var edit = document.getElementById('edit'); 

      $(edit).blur(function() { 
       localStorage.setItem('todoData', this.innerHTML); 
      }); 

      // when the page loads 
      if (localStorage.getItem('todoData')) { 
       edit.innerHTML = localStorage.getItem('todoData'); 
      } 

      window.addEventListener('storage', storageEventHandler, false); 

      function storageEventHandler(e){ 
       alert('localStorage event fired') 
      } 
     }); 
    </script> 
</head> 
<body> 
<header> 
    <h1> My Simple To-Do List </h1> 
</header> 
<section> 
<ul id="edit" contenteditable="true"> 
    <li></li> 
</ul> 
</section> 
    <em>Add some items, and refresh the page. It'll remember what you typed.</em> 
</body> 
</html> 

EDIT # 2 : Voici un exemple simple qui montre le problème entre les navigateurs ...

<html> 
<head> 
<script> 
    function storageEventHandler(e){ 
     alert('localStorage event fired') 
    } 
    window.addEventListener('storage', storageEventHandler, false); 
    localStorage.setItem('foo', 'bar'); 
    alert('ok') 
</script> 

</head> 
    <body> 
    Test 
    </body> 
</html> 

Répondre

7

Firefox 3.6 (Gecko 1.9.2) ne met pas en œuvre ces propriétés (la spécification est en train de changer et la plupart des autres navigateurs au moment n » ai pas t impl ement ces propriétés soit). Ceci est corrigé dans Firefox 4 (Gecko 2). Voir https://bugzilla.mozilla.org/show_bug.cgi?id=501423

[edit] votre cas de test est une page unique. Le spec dit:

Lorsque le setItem(), removeItem(), et des méthodes claires() sont appelés sur un objet de stockage x qui est associée à une zone de stockage local, si les méthodes ont fait quelque chose, puis dans tous les L'objet HTMLDocument dont l'objet Storage de l'objet localStorage de l'objet Window est associé à la même zone de stockage, autre que x, un événement de stockage doit être déclenché, comme décrit ci-dessous.

Vous avez donc besoin d'une page distincte sur le même domaine pour observer l'événement.

+0

merci! Très utile et apprécié :) – Alexis

+0

malheureusement rien ne fonctionne dans Firefox 4 = ( – Alexis

+0

@Alexis K: avoir un testcase? Quelle version testez-vous? – Nickolay

Questions connexes