創建級聯元素的JQuery

創建動態按鈕一個div，而這反過來應該創建另一個（分度按鈕），依此類推。

然而，下面的代碼無法正常工作：

<div id="M-0"> 
    <div id="M-0C"></div> 
    <input id="add_container" name="add_container" class="cua" type="button" value="Addition Container" > 
</div>

和jQuery代碼是：

$(document).ready(function() { 
    $(".cua").live("click", function(e){ 
     var father = $(this).parent();   
     var id_new=father.attr('id')+'.M-'; 
     var number=0; 
     while($('#'+id_new+number).length){ 
      number=number+1; 
     } 
     id_new=id_new+number; 
     alert('here '+id_new); 
     $('#'+father.attr('id')+'C').append('<div id="'+id_new+'"><div id="'+id_new+'C"></div><input id="add_container" name="add_container" class="cua" type="button" value="Addition Container" ></div>'); 
    }); 
});

的第一個按鈕作品的點擊，但在新創建的下一個點擊按鈕不起作用。

來源

2013-05-04 john smith

那麼，爲什麼不呢？你有新的ID的警報？你在控制檯中是否有任何錯誤？ – Bergi 2013-05-04 16:28:09

在第二次點擊'$（'＃'+ father.attr（'id'）+'C'）'不存在，因爲'father'是'＃M-0C'，所以它試圖尋找'#M -0CC'。 – 2013-05-04 16:37:42

我工作的控制檯，但我更喜歡警報，因爲它停止執行 – 2013-05-04 16:52:05

使用on()嘗試..

$(document).on('click','.cua',function(e){ 
    var father = $(this).parent();   
    var id_new=father.attr('id')+'.M-'; 
    var number=0; 
    ..... 

});

fiddle here

來源

2013-05-04 16:27:10 bipen

如果是這種情況，則不起作用在所有 – Musa 2013-05-04 16:31:19

@musa ..正確...我不知道我在想什麼，然後...我想我現在需要一杯咖啡..反正謝謝..：）...更新...使用委派事件爲創建的元素應該工作... – bipen 2013-05-04 16:41:31

標記

<div id="parent"> 
    <div class="button"><button>Add More</button></div> 
</div>

var $parent = $('#parent'); 
var $button = $parent.find('.button'); 

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

    event.preventDefault(); 
    $parent.append($button.clone()); 

});

Fiddle

來源

2013-05-04 16:46:42 moonwave99

創建級聯元素的JQuery

回答

相關問題