動態添加fieldset與兒童

Question

我有我的jQuery代碼的問題。我有一個帶有fieldset的表單，其中有很多表單域。點擊一個div後，我需要添加另一個字段集，包括具有相同屬性的childrens。當我第一次點擊div時，一切看起來都不錯，但第二次點擊時，什麼也沒有發生。第三次點擊時，有四個字段集，第四次點擊8，等等。我不知道在哪裏出了問題

HTML

<form> 
    <fieldset class=fieldsett> 
    <input> 
    <input> 
    </fieldset> 
<div id="insert">Insert</div> 
</form> 

jQuery的

$(document).ready(function() {  
var fieldset_parent = $(".fieldsett").eq(0).clone(); 
     $("div#insert").click(function(){ 
      $(".fieldsett").after(fieldset_parent); 
     }); 
}); 

非常感謝您的幫助

Answer 1

方法後，jQuery的附加在每一個元素後的參數化內容選擇。

所以

$(".fieldsett").after(fieldset_parent); 

成倍追加每個項目後的內容。

嘗試此代替：

$(".fieldsett:last").after(fieldset_parent); 

有關信息，請參見http://api.jquery.com/after/的，其具有以下描述的方法之後：

插入內容，由參數指定的，該組中的匹配的每個元素之後元素

編輯：我只是注意到，這仍然有一個項目消失的問題，我認爲這與jQuery如何附加克隆d元素添加到DOM。爲了解決這個問題，我會克隆每個追加的克隆，這樣每次都會向DOM添加一個唯一的元素。

$(function() {  
    var fieldset_parent = $(".fieldsett:eq(0)").clone(); 
    $("div#insert").click(function(){ 
    $(".fieldsett:last").after($(fieldset_parent).clone()); 
    }); 
});