2013-08-27 7 views
10
fehlgezündet

Im Internet Explorer 9 & 10, die localstorage Implementierung löst Ereignisse unerwartet (großer Thread hier: Bug with Chrome's localStorage implementation?)IE local Ereignis

Kennt jemand eine Möglichkeit, aus dem Brennen auf Registerkarten, um das storage Ereignis zu stoppen, dass die Änderung initiiert im Internet Explorer?

zum Beispiel die folgenden sollte eine Warnung nicht angezeigt, wenn die Schaltfläche Hinzufügen geklickt wird, aber es funktioniert in IE:

Geige: http://jsfiddle.net/MKFLs/

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Chrome localStorage Test</title> 
    <script type="text/javascript" > 

     var handle_storage = function() { 
     alert('storage event'); 
     }; 

     window.addEventListener("storage", handle_storage, false); 

    </script> 
    </head> 
    <body> 
    <button id="add" onclick="localStorage.setItem('a','test')">Add</button> 
    <button id="clear" onclick="localStorage.clear()">Clear</button> 
    </body> 
</html> 

EDIT: Auf einer Seite beachten, ich habe hier einen Bug mit MS geöffnet. https://connect.microsoft.com/IE/feedback/details/798684/ie-localstorage-event-misfired

Vielleicht wird es nicht geschlossen bekommen .....

+0

@EricLaw Dank für die Bearbeitung :) – Jesse

Antwort

11

Ändern Sie Ihr Skript auf die folgende verhindert, dass die Handhabung von irgendwelchen Speicher Ereignisse im aktiven Fenster.

Dies ist nicht genau das, was Sie gefragt, wie ich glaube, dass würde einen Patch für den Browser erfordern, aber es IE 9/10 zu der Spezifikation entsprechen, während keine nachteiligen Auswirkungen auf andere Browser (außer der globalen und Zuhörer).

<script type="text/javascript" > 
     var focused; 

     window.addEventListener('focus', function(){focused=1;}, false); 
     window.addEventListener('blur', function(){focused=0;}, false); 

     var handle_storage = function (e) { 
     if(!focused) 
      alert("Storage",focused); 
     }; 

     window.addEventListener("storage", handle_storage, false); 

</script> 

Siehe this fiddle für das aktualisierte, konforme Verhalten.

Edit: Im Folgenden auch arbeitet und vermeidet die Zuhörer auf Kosten einer Laufzeitprüfung von Fensterfokus:

<script type="text/javascript" > 

     var handle_storage = function (e) { 
     if(!document.hasFocus()) 
      alert("Storage"); 
     }; 

     window.addEventListener("storage", handle_storage, false); 

</script> 
+0

Man braucht keine zusätzliche Variable benötigen: http://stackoverflow.com/a/8235434/255363 (I getestet - Es funktioniert mit IE9 +, wo Speicherereignisse aufgetreten sind. – kirilloid

0

Wenn Sie Abhilfe suchen, können Sie Wrapper für local mit Semaphore schreiben.

Versuchen Sie, diese (nicht getestet):

var BetterStorage = { 
    _semaphore: false, 
    setItem: function(key, item) { 
     var that = this; 
     this._semaphore = 1; // only this tab 
     localStorage.setItem(key, item); 
     this._semaphore = 0; 
     // or setTimeout(function(){that._semaphore = 0}, 10) 
     // based on event-fire time (immedietaly or after short delay?) 
     // not tested 
    }, 
    getItem: function() {/*code*/}, 
    createHandler: function(f) { 
     var that = this; 
     return function(e){ 
      if (that._semaphore) { // execution of event is blocked 
       return false; 
      } 
      else { 
       return f(e); 
      } 
     } 
    } 
} 


var handle_storage = BetterStorage.createHandler(function() { 
     alert('storage event'); 
}); 
window.addEventListener("storage", handle_storage, false); 
+1

Diese Lösung funktioniert nicht - setItem wird abgeschlossen und zurückgeliefert, bevor das Ereignis ausgelöst wird, sodass das Semaphor bereits gelöscht wurde. –