javascript - 使用 event.target 返回一组项目(全局 div)中已修改的项目

Question

我们假设我们有以下 div 并包含以下元素:

    <div id="globalDiv" onchange="checkChange()">
        <input id="i1" type='number'/>
        <input id="i2" type='number'/>
        <input id="i3" type='number'/>
        <input id="i4" type='number'/>
        <input id="i5" type='number'/>
        <input id="i6" type='number'/>
    </div>

我的问题是:我可以知道“input”类型的哪个元素已被修改吗？

注意:

I know that one solution is to place the onchange = "checkChange (this)" in each input but I see it redundant.

Answer 1

您可以使用 event.target 来让元素在您想要的任何事件上触发，例如更改:

const myEl = document.querySelector("#globalDiv");

myEl.addEventListener('change', function(event) {
	console.log(event.target);
})

 <div id="globalDiv">
   <input id="i1" type='number'/>
   <input id="i2" type='number'/>
   <input id="i3" type='number'/>
   <input id="i4" type='number'/>
   <input id="i5" type='number'/>
   <input id="i6" type='number'/>
</div>