由addEventListener注册的jQuery触发器mousedown

Question

我想通过jQuery trigger()方法模拟假mousedown事件,并通过本机javascript方法注册mousedown事件 - addEventListener().我发现它无法触发......

elem.addEventListener('mousedown', function () {
    alert('addEventListener');
});
$(elem).on('mousedown', function () {
    alert('on');
});
$(elem).trigger('mousedown');

jsFiddle中的示例

我做了一些测试.

1. 通过jQuery注册mousedown事件()
   • 结果:有效
2. 通过addEventListener()注册click事件
   • 结果:有效

这里有什么不对吗？

谢谢.

PS之所以使用addEventListener(),是因为我想编写一个没有jQuery的库.

Answer 1

尝试使用

EventTarget.dispatchEvent

MDN链接

你的代码就像是

var elem = document.getElementById('square');
elem.addEventListener('mousedown', function () {
    alert('addEventListener');
});
$(elem).on('mousedown', function () {
    alert('on');
});

elem.dispatchEvent(new Event('mousedown'))

fireEvent如果您正在考虑使用IE,则可能需要使用.

object.fireEvent(bstrEventName, pvarEventObject, pfCancelled) 

MSDN链接

就像

if (document.createEvent) {
    element.dispatchEvent(event);
} else {
    element.fireEvent("on" + event.eventType, event);
}

Answer 2

Jquery仅触发自己创建的事件

甚至订单也很重要:这个工作

$(elem).on('mousedown', function () {
    alert('on');
});
$(elem).trigger('mousedown');

但是下面的代码将无效

 $(elem).trigger('mousedown');
 $(elem).on('mousedown', function () {
    alert('on');
});

看看这个DEMO FIDDLE