在事件本身的新元素上分配點擊事件

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); 
    } 
});