如何触发自定义可取消事件。

Question

我知道如何在JavaScript中触发事件，但是我不知道如何使它可以被取消，可以通过在事件处理程序中使用event.preventDefault()实现。

document.dispatchEvent(new CustomEvent("name-of-event", {}));

我已经写了如下的代码，但是如何通过event.preventDefault()本地化实现呢？

document.dispatchEvent(new CustomEvent("my-event",function keepGoing(result){
  if(result){
      // continue ...
  }
}));

// And then in event listener:
document.addEventListener('my-event',function(event,keepGoing){
keepGoing(true);
// Or keepGoing(false);
});

- behzad besharati

---

请创建一个 [mcve]，而不是发布不完整的代码 - 这里有一种 jQuery 的方法：https://dev59.com/SXE95IYBdhLWcg3wn_Vr - mplungjan

Answer 1

CustomEvent 构造函数接受第二个 options 参数，您可以使用它使事件成为 cancelable。请参阅 MDN 上的文章创建和触发事件。

var event = new CustomEvent("my-event", {
  cancelable: true
})

document.addEventListener('my-event', function (event) {
   event.preventDefault()
})

console.log(
  document.dispatchEvent(event) ? 'Event was not cancelled' : 'Event was cancelled'
)

- gyre

Answer 2

CustomEvent构造函数接受CustomEventInit作为第二个参数。CustomEventInit是EventInit的扩展，可以在此处https://developer.mozilla.org/en-US/docs/Web/API/Event/Event找到描述。

最后。

document.dispatchEvent(new CustomEvent('my-event', {cancelable: true}));

- wookieb