Question

有没有办法使用EventTarget.dispatchEvent()或HTMLElement.click()将数据传递给事件处理程序？

var button = document.getElementById('button');

button.addEventListener('foobar', function() {
    console.log(arguments); // [Event]
});

button.addEventListener('click', function() {
    console.log(arguments); // [MouseEvent]
});

button.click({ foo: 'bar' });

var event = document.createEvent('HTMLEvents');
event.initEvent('foobar', true, false);
button.dispatchEvent(event, { foo: 'bar' });

Answer 1

我认为您要寻找的是自定义事件，可以附加自定义参数，如下所示：

//Listen for the event
window.addEventListener("foobar", function(evt) {
    alert(evt.detail);
}, false);

//Dispatch an event
var evt = document.createEvent("CustomEvent");
evt.initCustomEvent("foobar", true, true, "Object");
window.dispatchEvent(evt);

阅读here

Answer 2

这应该使用jquery来回答你的问题：

button.bind('click', { name: 'something' }, function(event) {
    alert(event.data.name);
});

另请参阅：http://api.jquery.com/event.data/

通过dispatchEvent或HTMLElement.click将数据传递给事件处理程序

2 个答案: