Question

我是一个有点绿色的程序员，对javascript / jquery很新，但我以为我理解了javascript事件。显然不是。我无法按照自己的意愿让事件监听器工作。

给出javascript：

var Thing = {
    //stuff
    update: function() {
        $.event.trigger({type:'stateUpdate', more:stuff});
    }
};

var Room = {
    //more stuff
    updateHandler: function (e) {
        //handle event here
    }
};

如果我做jquery：

$(document).on('stateUpdate', $Room.updateHandler);

然后它工作正常，但我不能做任何

$(Room).on('stateUpdate', $Room.updateHandler);

或

Room.addEventListerner('stateUpdate', $Room.updateHandler);

第一个没有做，第二个给出.addEventListerner不是函数错误。

我用Google搜索了几个小时，无法弄明白。我找到了一些说.addEventListener只适用于实现EventListener的对象，一些关于handleEvent的东西，以及一些关于自动实现EventListener的函数。没有关于如何使对象实现它的任何内容。有没有办法将侦听器添加到不是函数的javascript对象？我是否必须创建一个事件处理程序对象，或使用“文档”或“窗口”并让它调用处理程序？这看起来真的很难看。

对象应该首先起作用吗？那会有用吗？看来目前的观点是，制作所有功能只是试图将javascript变成不是的东西。

Answer 1

AFAIK没有办法向普通对象添加事件监听器，因为它没有放在DOM中。事件在DOM内部触发，并且冒泡，因此您的自定义对象的事件侦听器将不会接收它。

有一个http://www.bobjs.com/框架可以帮助您实现自定义事件。

Answer 2

回应@Barmar（有点）我相信我已经解决了这个问题。但是，确认这是否是一个好的替代方案会很好。基本上，我必须做一个订阅者的事情，对吧？几乎是事件/听众，但并不完全。

var thing = {
    callbacks: {},
    regCallback: function (key, which) {
        callbacks[key] = which;
    },
    remCallback: function (key) {
        callbacks[key].delete;
    }
    update: function(e) {
        for(var i = 0, len = callbacks.length; i < len;i++){
            callbacks[i](e);
        };
    }
};

var Room = {
    updateHandler: function () {
        //handle stuff
    },
    subscribe: function (which, callback) {
        which.regCallback('room', callback);
    }
    unsub: function (which) {
        which.remCallback('room');
    }
};

//wherever/whenever I need to get updates something like
Room.subscribe(thing, Room.updateHandler);
//unsub
Room.unsub(thing);

Answer 3

第二个错误是由拼写错误引起的：addEventListerner中有额外的r。

如何将事件侦听器附加到javascript var

3 个答案: