div上的JavaScript click事件

时间:2016-12-08 00:16:47

标签: javascript jquery html events dom

我正在研究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));
});
&#13;
<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">
&#13;
&#13;
&#13;

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

现在这是我开始出错的地方。我使用类CLICKABLE将事件附加到div,我想检索该特定DIV元素的id(id =&#39; idToShow&#39;);但是我一直在检索以下DIV的id(id =&#39; notToShow&#39;)。

我可能不完全理解为什么会发生这种情况以及如何防止它以获得正确的ID。

1 个答案:

答案 0 :(得分:0)

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