您當前的代碼有幾個問題.其中之一是,正如其他人所說,添加和刪除按鈕是動態創建的,因此您不能簡單地將單擊處理程序附加到按鈕.您必須在創建按鈕時重新附加處理程序,或者將處理程序附加到正文,如@medhi所示：

$("body").on("click", ".addmore", function() { ... });

另一個問題是表單的容器對于每個地址沒有單獨的容器.因此,當您復制表單元素時,您將復制已創建的所有元素：每次單擊添加時元素的數量加倍.解決方法是將地址表單包裝在單獨的容器中：

...

...

...

第三個問題是當你復制一個表單時,如果它不是第一個表單,它可能已經包含一個刪除按鈕.在這種情況下,您應該跳過刪除按鈕創建.

以下是一個完整的解決方案.

HTML：

Add More Address

使用Javascript：

var rowNum = 0;

$("body").on("click", ".addmore", function() {

rowNum++;

var $address = $(this).parents('.address');

var nextHtml = $address.clone();

nextHtml.attr('id', 'address' + rowNum);

var hasRmBtn = $('.rmbtn', nextHtml).length > 0;

if (!hasRmBtn) {

var rm = "Remove"

$('.addmoreadd', nextHtml).append(rm);

}

$address.after(nextHtml);

});

$("body").on("click", ".rmbtn", function() {

$(this).parents('.address').remove();

});

總結

以上是生活随笔為你收集整理的把html追加到指定id后面,javascript – jQuery,动态追加元素时增加id号的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。