Question

我建立一个不依赖Jquery的库，以便更好地掌握我的javascript知识。但是，在编写库的测试时，我使用了一些Jquery方法。

我有一个测试，它使用Jquery的EventTarget.addEventListener方法触发使用本机.trigger方法添加的事件侦听器。

var elem = document.getElementById('square');
elem.addEventListener('click', function () {
    alert('click');
});
elem.addEventListener('mouseover', function () {
   alert('mouseover');
});
$(elem).trigger('click');
$(elem).trigger('mouseover');

当我在同一元素上触发两个不同的事件时，只会触发一个处理程序。

这可以在JSFiddle

中观察到

有人可以解释为什么会发生这种情况以及如何解决这个问题吗？

Answer 1

如果您使用addEventListener，则无法使用jQuery的trigger方法。（它适用于某些事件，例如click，但不适用于所有人，例如mouseover，正如您所注意到的那样。这也在this question中解释。

您有两种选择。您可以使用jQuery的on事件，如下所示：

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

或者另一种是在不使用jQuery的情况下触发事件。您可以查看this question来执行此操作。

Jquery触发器仅适用于addEventListener一次指定的一个事件

1 个答案: