event 注册和绑定

最新推荐文章于 2021-09-07 21:05:31 发布

原创最新推荐文章于 2021-09-07 21:05:31 发布 · 331 阅读

0 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了一种在浏览器环境中实现跨标签页通信的方法。通过利用`localStorage`的`storage`事件，文章详细解释了如何注册事件监听器以及如何触发这些事件来实现实时更新。此机制对于需要在不同标签页间共享状态的应用尤其有用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

(function() {

    this.idesignEvent = {
        events: {},
        on: function(event, callback) {
            if (event in this.events) {
                this.events[event].push(callback)
            } else {
                this.events[event] = [];
                this.events[event].push(callback)
            }
        },
        fire: function(event, data) {
            var eventContent = arguments[1];
            if (event in this.events) {
                this.events[event].forEach(function(callback) {
                    callback(eventContent)
                })
            }
        },
        crossTabFire: function(event, data) {
            localStorage.setItem('message',
                JSON.stringify({ event: event, fileid: minder.fileid, data: data }));
            localStorage.removeItem('message');
        }
    }

    this.addEventListener('storage', function(e) {
        if (e.key != 'message') return; 
        var message = JSON.parse(e.newValue);
        if (!message) return; 

        if (message.fileid == minder.fileid) {
            log.info('cross tab message:', message);
            message.data.isCrossTab = true;
            idesignEvent.fire(message.event, message.data);
        } 
    });


}).call(window);