Javascript 当所有元素都具有相同的类名时，如何获取已单击元素的id？

我的代码是这样的

<select id="id_1" class="editable-input" name="name_1">

<select id="id_2" class="editable-input" name="name_2">

<select id="id_3" class="editable-input" name="name_3">

我如何知道正在单击哪个元素，以及如何获取已单击元素的id和名称

---

PS：我想稍后用javascript编写代码，因为我将把代码放到GTM变量中

如果您使用的是jQuery，那么可以使用以下代码：

 $(".editable-input").on("click", function(e) {
    var sender = $(this);

    console.log(sender.prop("id"));
    //OR
    console.log(this.id);
 });

如果您使用的是JavaScript：

 var items = document.getElementsByClassName("example"),
     currentItem;

 for(var i = items.length; i--;) {
   currentItem = items[i];
   currentItem.onclick = function(e) {
      console.log(this.id);
   };
 }

---

使用纯JS+html更新：

var info=函数（dd）{
警报（dd.id+“，”+dd.name）；
};
有一些方法可以做到这一点，但最好的方法是将一个事件委托给孩子的家长


var div=document.getElementById（“父项”）；
div.addEventListener（“单击”，函数（e）{
var el=e.target；
//在这里，您可以获取el.id和el.name，并执行任何您想要的操作
如果（el.tagName.toLowerCase（）=“选择”）
警报（el.id）；
});

Hi Irene，如果您是StackOverflow的新手，如果您觉得答案很有帮助。你可以在答案旁边打勾，以帮助研究人员确定好的解决方案。你也可以通过在答案得分上方勾选向上图标（upvote）来回报那些回答问题的人。这个问题没有用jQuery标记，因此答案不应该基于一个繁重的库来完成简单的任务，比如委派一个事件@Buzinas，OP之前有JQuery标签好吧，抱歉，那么。当我看到它时，它不再有了。@Buzinas-最初没有jquery标记，但另一个用户编辑了这个问题并添加了它。我再次删除了它，因为OP没有提到jQuery。