javascript - 附加后调用单击处理程序

Question

我有这样的代码。

$('child').on('click', function(){ 
    ...
    $('parent').on('click', function () {
         doSomething();
    });
});

问题是附加后立即调用父单击处理程序。可能是因为点击仍在处理中。我怎样才能防止这种情况？

Answer 1

扩展 Punil 的解决方案我建议类似

Live Demo

$('#child').on('click', function(e){ 
  window.console && console.log("child click");
  e.stopPropagation();
  if (!$('#parent').data("clickhandler")) {
    $('#parent').data("clickhandler","already added");
    $('#parent').on('click', function(){ 
      window.console && console.log("parent clicked");
    });
  }    
  window.console && console.log("child clicked");
});

Answer 2

停止将事件传播到其父元素和祖先元素。

$('child').on('click', function(evt) {
    evt.stopPropagation();

Answer 3

问题理解：
当点击child被执行时，事件被传播到它parent的，你已经在孩子点击期间添加了事件处理程序。因此，在孩子的点击事件处理程序之后，父母的点击事件处理程序被触发。

解决方案：
停止这种行为的解决方案是e.stopPropagation在孩子的事件处理函数中添加第一件事，如：

$('child').on('click', function(e){ 
    e.stopPropagation;
    ...
    $('parent').on('click', function () {
        doSomething();
    });
});

演示：
试试这个@http: //jsfiddle.net/purnil/DpVGq/