如何使用JavaScript实现匿名事件传递？

所需场景：

---

在源文件A.html中，元素A的onclick处理程序被编码为在每次单击时触发自定义事件

在源文件BCD.js元素B中，C&D（在元素A编码时未知）希望订阅/处理/响应/响应由A的onclick handler函数触发的自定义事件

---

---

在本例中，从A的角度B来看，C&D是自定义事件的匿名接收者。

您可以执行某种pubsub实现

var events = {};

var pubsub = {
    on: function(event, handler) {
        if(event in events) {
            events[event].push(handler);
        } else {
            events[event] = [handler];
        }
    },
    emit: function(event) {
        if(event in events) {
            events[event].forEach(function(handler) {
                handler.call(null, event);
            });
        }
    }
};

这种实现将自定义事件绑定到全局对象，因此元素不必像您提到的那样相互“了解”。实现上述功能的方法如下所示：

document.getElementById('some-element').addEventListener('click', pubsub.emit.bind(null, 'custom-event'));

单击将发出一个事件，并调用任何处理程序。因此，在其他模块或其他任何模块中，基于您规定的任何操作，您可以将处理程序与该事件关联：

pubsub.on('custom-event', doSomething);

function doSomething() { ... }

我认为这是一个非常正常的、与语言无关的全局事件处理实现

var events = {};

var pubsub = {
    on: function(event, handler) {
        if(event in events) {
            events[event].push(handler);
        } else {
            events[event] = [handler];
        }
    },
    emit: function(event) {
        if(event in events) {
            events[event].forEach(function(handler) {
                handler.call(null, event);
            });
        }
    }
};

---

JavaScript开发人员已经找到了很多方法来处理这个问题

首先，区分DOM事件和一般编程中的events/pubsub概念以及常见的javascript模式非常重要

DOM事件是浏览器api，用于告诉javascript代码发生了什么。它们也是asyc

您正在谈论的自定义事件是javascript代码内部的通信方式，也称为“事件” 下面是这种模式的基本实现 在下划线代码中，它是一个简单的同步函数调用

还有一件事：
从技术上讲，您可以使用自定义名称触发DOM事件，并使用它在javascript代码的不同部分之间进行通信。我建议阿金斯这样做。

---

这也将使通信异步

可能重复同样的，我很难理解您的示例的含义。html文件名与任何单个元素无关，JavaScript中没有html元素，除非您首先编写代码来实现这一点，因此：您能否改写您的问题，使用一个不太神秘的示例，使用事物的普通名称，以及您想象的实际html和JS代码，所以我们至少可以在评论/回答中谈论一些东西？不。在A的观点中，没有B、C和D，只有一个元素可以触发事件。它对订阅者一无所知。这满足了我的需要：

document.getElementById（'some-element'）

。。。将事件侦听器添加到哪个元素是否重要（例如，是否存在范围规则）？例如，如果将事件侦听器添加到DOM中的叶

，那么可见性/可访问性是否与将事件侦听器附加到

元素的情况有所不同？如果没有关系，最佳做法是什么？@neohuerist，本机单击事件只能由事件目标的父级和子级看到（事件根据不同的情况向上/向下冒泡）。但是，全局事件

自定义事件

将作为全局

pubsub

对象的一部分进行广播，例如，您提到的一片叶子可以看到它。基本上，通过将

pubsub

emission作为本机

click

的处理程序附加，您在某种意义上强制click事件变为“全局”。因此，事件侦听器可以附加到文档中的任何元素。--我倾向于将所有事件侦听器添加到

中，以强调全局范围（并不是说这样做会有任何功能价值）——这听起来合理吗？@Neohuerist，你的建议在理论上是有意义的，但在实际意义上对我来说几乎是一种反模式。我的直觉告诉我有更好的办法。例如，MVC框架已经解决了许多这些问题。你到底想做什么？你在做一个项目吗，或者你只是从理论上看它？这是一个项目，我自己一个人-所以我很抱歉挑刺-我在

中有一个编辑按钮，当点击时，我想通过添加一个类来激活编辑

，使CSS将

从

显示：无至<代码>显示：块。。。（将可能处于活动状态的任何其他
更改为
显示：过程中无）