浏览器 javascript 创建自定义事件答案

【问题标题】：browser javascript creating custom events浏览器 javascript 创建自定义事件
【发布时间】：2021-10-17 13:45:56
【问题描述】：

我不明白这个：

我尝试创建一个自定义事件，当列表完全加载到表格正文中时应该触发该事件。像这样（加载列表后执行）：

  var event = new Event('mklistloaded', {
        name: 'listname'
  });

  document.dispatchEvent(event);

这是“接收”端：

document.addEventListener('mklistloaded', function(e) {

    console.log('mklistloaded event: ' + JSON.stringify(e));

});

但是控制台日志打印出来：

mklistloaded event: {"isTrusted":false}

这与 Mozilla 示例中描述的完全一样：

https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events

我在这里做错了什么？

【问题讨论】：

标签： javascript events dom browser mozilla

【解决方案1】：

您错过了docs 中的部分“添加自定义数据 – CustomEvent()”

document.addEventListener('mklistloaded', function(e) {
  console.log('mklistloaded detail: ', e.detail);
});
// use CustomEvent() instead of Event()
var event = new CustomEvent('mklistloaded', {
  'detail': 'listname'
});

document.dispatchEvent(event);

请注意，它似乎需要使用属性名称detail

【讨论】：