動態添加fieldset與兒童

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

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

非常感謝您的幫助

來源

2013-06-29 scooti

一旦你有'.fieldset'和一次'.fieldsett' –

謝謝..這只是錯誤在這裏..在我的源代碼中沒有問題。 – scooti

方法後，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()); 
    }); 
});

來源

2013-06-29 10:44:57 boniestlawyer

非常感謝boniestlawyer。太奇妙了！ – scooti

有一個問題..它不工作在IE ..我在IE9和Firefox IE瀏覽器中測試ID具有相同的結果..點擊按鈕後沒有任何反應 – scooti

我看了IE10（只有一個可用的時刻），並按照以下方式正常工作：http://jsbin.com/ovufuh/3/edit，這是一個新問題嗎？ – boniestlawyer

動態添加fieldset與兒童

回答

相關問題