javascript - 调度 CustomEvent 始终返回 true

Question

根据(我的理解)documentation ，如果任何事件监听器在处理事件时调用 Event.preventDefault() 方法，则 dispatchEvent 方法应返回 false。但如果我尝试使用 CustomEvent 对象，dispatchEvent 始终返回 true。请检查以下代码片段:

var div = document.getElementById("test");

div.addEventListener("custom", function(e) {
  e.preventDefault();
});

div.innerHTML = div.dispatchEvent(new CustomEvent("custom"));

<div id="test"></div>

我哪里出错了？

Answer 1

您正在调度一个名为“test”的自定义事件，但正在监听“custom”，因此您的处理程序永远不会被调用。您还需要通过将 cancelable: true 添加到 init 对象来确保您的事件可以取消:

var div = document.getElementById("test");

div.addEventListener("custom", function(e) {
  e.preventDefault();
});

div.innerHTML = div.dispatchEvent(new CustomEvent("custom", {
    cancelable: true
}));

<div id="test"></div>