将自定义事件绑定到 JavaScript 对象？答案

【问题标题】：Bind custom event to JavaScript object?将自定义事件绑定到 JavaScript 对象？
【发布时间】：2011-03-31 20:42:41
【问题描述】：

我不知道该怎么做。它似乎是这样的：

function MyObject() {
    this.fireEvent("myEvent");
}

然后在一个单独的 JavaScript 文件中：

var obj = new MyObject();
obj.addEventListener("myEvent", function() {
    alert("Event Fired");
});

但它当然行不通。我的问题是，我将如何去做这样的事情？

【问题讨论】：

您是在问，如何在 JavaScript 中进行事件绑定/触发，还是在使用一组特定的工具？

标签： javascript events object binding

【解决方案1】：

在您的示例中，您在构造函数中立即触发事件（在附加事件侦听器之前）。尝试将触发逻辑移动到单独的函数中。

更新：

此外，您似乎没有正确触发事件。有关如何以跨浏览器方式正确触发事件的更多信息，请参阅this article。从那篇文章：

function fireEvent(element,event){
    if (document.createEventObject){
        // dispatch for IE
        var evt = document.createEventObject();
        return element.fireEvent('on'+event,evt)
    }
    else{
        // dispatch for firefox + others
        var evt = document.createEvent("HTMLEvents");
        evt.initEvent(event, true, true ); // event type,bubbling,cancelable
        return !element.dispatchEvent(evt);
    }
}

【讨论】：

好的，所以我实现了 Firefox 等的部分（我根本不针对 IE）。然而，从那篇文章看来，“元素”变量需要是一个 DOM 对象。就我而言，它不是，它是一个 JavaScript 对象。我尝试使用“this.initEvent(...”但没有运气。
这是一个不幸的限制。作为一种解决方法，您可以从 body 元素触发自定义事件并从该元素监听事件。