Javascript 未调用 localStorage eventListener

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5370784/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 16:54:29  来源:igfitidea点击:

localStorage eventListener is not called

javascripthtmllocal-storage

提问by doemsche

I added an eventListener to the window DOM-Object and want to keep track of the changes made to localStorage.

我向窗口 DOM-Object 添加了一个 eventListener 并希望跟踪对 localStorage 所做的更改。

<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>

    <script language="JavaScript"><!-- 
        window.addEventListener('storage', storageEventHandler, false);
        function storageEventHandler(evt){
            console.log("oldValue: " + evt.oldValue );
            console.log("storage event called key: " + evt.key );
            console.log("newValue: " + evt.newValue );

        }
        $(document).ready(function(event) {
            $('#link1').click(function(event){
                event.preventDefault();
                localStorage.setItem('page', 2000);
                console.log(localStorage.getItem('page'));
            });
            $('#link2').click(function(event){
                event.preventDefault();
                localStorage.setItem('page', 998);
                console.log(localStorage.getItem('page'));

            });

         });
    </script>
</head>
</html>

Somehow the storageEventHandler is never called even though the localStorage value is changed when I click link1 or link2. Any help is much appreciated.

即使在单击 link1 或 link2 时更改了 localStorage 值,storageEventHandler 也不会被调用。任何帮助深表感谢。

回答by Nathan Bubna

Some browsers don't support the storage event, and most of the browsers that do support it will only call it when the storage is changed by a different window. So, open your page up in two windows. Click the links in one window and you will probably see the event in the other.

一些浏览器不支持 storage 事件,并且大多数支持它的浏览器只会在存储被不同的窗口更改时调用它。因此,在两个窗口中打开您的页面。单击一个窗口中的链接,您可能会在另一个窗口中看到该事件。

The assumption is that your page will already know all interactions with localStorage in its own window and only needs notification when a different window changes things. This, of course, is a foolish assumption. But, localStorage is a new thing. Hopefully, they'll eventually figure it all out.

假设您的页面已经知道在其自己的窗口中与 localStorage 的所有交互,并且仅在不同的窗口发生变化时才需要通知。当然,这是一个愚蠢的假设。但是,localStorage 是一个新事物。希望他们最终会弄清楚这一切。

回答by subham.saha1004

The storageevent handler will only affect other windows. Whenever something changes in one window inside localStorageall the other windows are notified about it and if any action needs to be taken it can be achieved by a handler function listening to the storageevent.

storage事件处理程序只会影响其他窗口。每当localStorage所有其他窗口内的一个窗口中的某事发生变化时,都会收到通知,如果需要采取任何行动,则可以通过侦听该storage事件的处理程序函数来实现。

For same window you have to manually call the storageEventHandlerfunction after localStorage.setItem()is called to achieve the same behaviour in the same window.

对于同一个窗口,您必须在调用storageEventHandler后手动调用该函数localStorage.setItem()才能在同一个窗口中实现相同的行为。