div上的JavaScript click事件

Question

我正在处理JavaScript项目，但单击事件有问题，并且正在检索有关单击元素的正确信息。 我对JavaScript比较陌生。

我正在使用的实际代码相当复杂，但是我只发布了一部分代码来说明我的问题。

 function App(){ this.name = "New App"; } App.prototype.createDIV = function() { var h = "<div class='clickable' id='idToShow'><div class='name' id='notToShow'>" + this.name + "</div></div>"; $('#content').html(h); } App.prototype.showID = function(e) { if (e.target.id == 'idToShow') { alert(this.name); // this doesn't display, because incorrect ID is retrieved } } $(document).ready(function() { var newApp = new App(); $("input#btn").click(newApp.createDIV.bind(newApp)); $("div").on("click", ".clickable", newApp.showID.bind(newApp)); }); 

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> </head> <div id="content"></div> <input type="button" id="btn" value="CLICK"> 

我的应用程序中有一个带有多个原型的对象。 在文档加载时，将构造对象，将事件附加到元素并绑定到对象。 单击该按钮，将动态创建一组新的div结果。

现在，这对我来说开始出错了。 我将一个事件附加到类为CLICKABLE的div上，我想检索该特定DIV元素的id（id ='idToShow'）; 但是，我一直在检索以下DIV的ID（id ='notToShow'）。

我可能不完全了解为什么会发生这种情况，以及如何采取措施防止这种情况以获取正确的ID。

Answer 1

尝试使用if (e.currentTarget.id == 'idToShow')代替if (e.target.id == 'idToShow') 。