我有一个类似下面的设置，其中体内的所有三个元素都订阅了某个事件（相关代码pen）：
var div = document.querySelector('div');
var span = document.querySelector('span');
var button = document.querySelector('button');
div.addEventListener('ding', function() {
console.log('click');
});
span.addEventListener('ding', function() {
console.log('clack');
});
button.addEventListener('ding', function() {
console.log('bang');
});
document.body.dispatchEvent(new CustomEvent('ding')); // ???
// expected output: 'click clack bang'<body>
<div></div>
<span></span>
<button></button>
</body> 据我所知，CustomEvent气泡会向上流动，不会滴下，这可能正是我所需要的。是否有可能调度a，CustomEvent以便所有三个处理程序都将被解雇？
您将必须分别在三个元素上触发事件。但是，您可以使用addEventListener()您的document.body，以使其触发这些事件的每一个元素时document.body.dispatchEvent(new CustomEvent('ding'));被调用。
例子：
var div = document.querySelector('div');
var span = document.querySelector('span');
var button = document.querySelector('button');
div.addEventListener('ding', function() {
console.log('click');
});
span.addEventListener('ding', function() {
console.log('clack');
});
button.addEventListener('ding', function() {
console.log('bang');
});
document.body.addEventListener('ding', function() {
div.dispatchEvent(new CustomEvent('ding'));
span.dispatchEvent(new CustomEvent('ding'));
button.dispatchEvent(new CustomEvent('ding'));
});
document.body.dispatchEvent(new CustomEvent('ding'));<body>
<div></div>
<span></span>
<button></button>
</body>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句