使用自定义附加数据创建 JavaScript 事件

标签 javascript event-handling dom-events

是否有一种 JavaScript 方法可以将自定义数据传递给手动创建的 JavaScript 事件?

好吧,假设我有这段代码来创建和触发一个 JavaScript 事件:

var evObj = document.createEvent('HTMLEvents');
evObj.initEvent('submit', bubbling, cancelable);
anElement.dispatchEvent(evObj);

这工作正常,可以使用以下代码处理:

document.addEventListener('submit', mySubmitEventHandler, true);

但是,我需要一种方法将附加数据传递给事件,以便 mySubmitEventHandler 知道事件是由用户触发的还是由 JavaScript 事件创建触发的,如上所示。一个 bool 值就足够了。

那么,如何向新创建的 evObj 添加类似“myEvent = true”的内容?

请不要用 jQuery 回答,我需要用纯 JavaScript 来做这个。

最佳答案

将参数附加到evObj

evObj.flag = 'Hi!';
anElement.dispatchEvent(evObj);

此代码演示了 dispatchEvent 传递的事件对象等于事件监听器中的那个 ( Live demo ):

var evObj = document.createEvent('HTMLEvents');
document.body.addEventListener('test', function(e){ alert(e === evObj); },true);
evObj.initEvent('test', true, true);
document.body.dispatchEvent(evObj); // Shows alert, "true"

关于使用自定义附加数据创建 JavaScript 事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9071485/

相关文章:

javascript - Visual Studio Code : Failed to apply ESLint fixes to the document

javascript - 无法在 IE 中比较 Jquery ajax 对象

android - 如何在屏幕上拖动时引发事件

javascript - preventDefault 会阻止 Mac 上 Firefox 中的右键单击菜单,但不会阻止 Windows

javascript - 光标在哪个 TextBox 中?

javascript - 在悬停时更改 span/div 中的 SVG 图标的最简单方法?

javascript - 在 Google-App 脚本中对表数据 onclick <th> 进行排序

java - 如何判断 SWT Shell 是通过编程方式关闭还是由用户关闭?

javascript - 如何使用 QUnit 测试事件监听器

javascript - 使用 touchstart 和/或单击(鼠标按下)Angular 6