Window: storage event
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit April 2017 browserübergreifend verfügbar.
Das storage-Ereignis der Window-Schnittstelle wird ausgelöst, wenn ein anderes Dokument, das denselben Speicherbereich (entweder localStorage oder sessionStorage) mit dem aktuellen Fenster teilt, diesen Speicherbereich aktualisiert. Das Ereignis wird nicht im Fenster, das die Änderung vorgenommen hat, ausgelöst.
- Für
localStoragewird das Ereignis in allen anderen Browsing-Kontexten ausgelöst, die sich im selben Ursprung wie das auslösende Dokument befinden. Dazu gehören andere Tabs mit demselben Ursprung. - Für
sessionStoragewird das Ereignis in allen anderen Browsing-Kontexten ausgelöst, die sich im selben Ursprung und im selben übergeordneten Browsing-Kontext wie das auslösende Dokument befinden. Dies schließt nur eingebettete iframes, falls vorhanden, im selben Tab ein, jedoch nicht andere Tabs.
Dieses Ereignis kann nicht abgebrochen werden und löst keine Bubbeling-Effekte aus.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Ereignishandler-Eigenschaft.
addEventListener("storage", (event) => { })
onstorage = (event) => { }
Ereignistyp
Ein StorageEvent. Erbt von Event.
Ereignishandler-Aliase
Zusätzlich zur Window-Schnittstelle ist die Ereignishandlereigenschaft onstorage auch auf den folgenden Zielen verfügbar:
Beispiele
Protokollieren Sie das sampleList-Element in der Konsole, wenn das storage-Ereignis ausgelöst wird:
window.addEventListener("storage", () => {
// When local storage changes, dump the list to
// the console.
console.log(JSON.parse(window.localStorage.getItem("sampleList")));
});
Die gleiche Aktion kann mit der onstorage-Ereignishandlereigenschaft erreicht werden:
window.onstorage = () => {
// When local storage changes, dump the list to
// the console.
console.log(JSON.parse(window.localStorage.getItem("sampleList")));
};
Spezifikationen
| Spezifikation |
|---|
| HTML # event-storage |
| HTML # handler-window-onstorage |