示例 1：
element1.addEventListener("input", function() {
this function does stuff
});
示例 2：
element1 && element2.addEventListener("input", function() {
this function does stuff
});
它在语法上可能不正确，但是有没有一种方法可以同时（同一行）为两个元素提供相同的事件侦听器，而不必将它们分开？
如何将EventListener添加到一行中的多个元素
IT技术
javascript
dom
2021-02-06 14:49:39
6个回答
好吧，如果你有一个包含元素的数组，你可以这样做：
let elementsArray = document.querySelectorAll("whatever");
elementsArray.forEach(function(elem) {
elem.addEventListener("input", function() {
//this function does stuff
});
});
事件冒泡是javascript中的重要概念，所以如果可以直接在DOM上添加事件，可以节省一些代码行，不需要循环：
document.addEventListener('click', function(e){
if(e.target.tagName=="BUTTON"){
alert('BUTTON CLICKED');
}
})
如果您不想定义单独的 elementsArray 变量，您可以从具有两个元素的未命名数组中调用 forEach 。
[ Element1, Element2 ].forEach(function(element) {
element.addEventListener("input", function() {
this function does stuff
});
});
一条线
document.querySelectorAll("whatever").forEach(elem => elem.addEventListener("input", fn))
我不能为此解决方案申请功劳，但我在这里找到了一个很好的解决方案。
https://www.kirupa.com/html5/handling_events_for_many_elements.htm
var theParent = document.querySelector("#theDude");
theParent.addEventListener("click", doSomething, false);
function doSomething(e) {
if (e.target !== e.currentTarget) {
var clickedItem = e.target.id;
alert("Hello " + clickedItem);
}
e.stopPropagation();
}