在事件本身的新元素上分配点击事件

Question

我想创建一个新元素并为该元素分配它创建的onclick的相同事件。

DEMO

$(function(){ 
    var counter = 0; 
    $('.sub').click(function(event){ 
     event.stopPropagation(); 
     counter++; 
     $div = $(this); // makes more sense in the original code 
     $div.append('<div class="sub" title="subsub">subsub' + counter + '</div>'); 
     //$div.find('.sub').click // <-- ????? 
    }); 
}); 

在我的演示中，我想创建一个每个子，它被点击一个新subsub。比我想要添加相同的点击事件到新的子元素。

任何人都可以帮助我吗？ 我没有发现这个问题。也许我没有为谷歌或SO正确的关键字：/

Answer 1

只需使用事件代表团

$(document).on('click', '.sub', function(event){ 

您的单击事件似乎在这一点上正常工作，因为你正在使用append这实际上嵌套在被点击的div内的new div。尝试使用after并且功能中断。

$(function(){ 
    var counter = 0; 
    $(document).on('click', '.sub', function(event){ 
     event.stopPropagation(); 
     counter++; 
     $div = $(this); // makes more sense in the original code 
     $div.after('<div class="sub" title="subsub">subsub' + counter + '</div>'); 
    }); 
}); 

Check Fiddle

Answer 2

为什么不创建正确的元素代替：

$(function(){ 
    var counter = 0; 
    $('.sub').on('click', doStuff); 

    function doStuff(event) { 
     event.stopPropagation(); 
     counter++; 
     var $div = $(this), 
      $sub = $('<div />', {'class':'sub', 
           title : 'subsub', 
           text : 'subsub' + counter, 
           on  : { 
              click : doStuff 
              } 
           } 
     ); 

     $div.append($sub); 
    } 
});