如何在javascript/jquery中刪除動態創建的元素？

所以我想找出一種方法來刪除我的程序中動態創建的元素。我目前可以在當前的模式之上或之下添加一個模式。如何在javascript/jquery中刪除動態創建的元素？

我想要做的是在正方形的兩排旁邊添加一個刪除按鈕，然後一旦用戶單擊該按鈕，特定圖案將被刪除，所有其他圖案將移動到適當的位置。

我迄今所做的：

var id_num = 1; 
var picker = null; 
$(function() { 
$(document).on('click', ".repeat", function (e) { 
    e.preventDefault(); 
    var $self = $(this); 
    var $parent = $self.parent(); 
    if($self.hasClass("add-bottom")){ 
     $parent.after($parent.clone(true).attr("id", "repeatable" + id_num)); 
     id_num = id_num + 1; 
     //picker = null; 

    } else { 
     $parent.before($parent.clone(true).attr("id", "repeatable" + id_num)); 
     id_num = id_num + 1; 
     //picker = null; 
    } 
}); 
});

任何幫助或反饋，非常感謝！

來源

2016-09-28 blazerix

您可以在容器中添加刪除按鈕並使用它刪除。可以很容易地移動你想要的按鈕。

http://codepen.io/anon/pen/QKgBzP

var id_num = 1; 
var picker = null; 
$(function() { 
$(document).on('click', ".repeat", function (e) { 
    e.preventDefault(); 
    var $self = $(this); 
    var $parent = $self.parent(); 
    var newobj=$parent.clone(true).attr("id", "repeatable" + id_num); 
    if($self.hasClass("add-bottom")){ 
     $parent.after(newobj); 
     id_num = id_num + 1; 
     //picker = null; 

    } else { 
     $parent.before(newobj); 
     id_num = id_num + 1; 
     //picker = null; 
    } 
    newobj.append("<button class=\"remove\"> Remove</remove>"); 
}); 
$(document).on('click', ".remove", function (e) { 
    $(this).parent().remove(); 
}); 
});

來源

2016-09-28 16:51:04 Tobia

你知道我怎麼能讓刪除按鈕出現在兩排正方形旁邊嗎？ – blazerix

您很可能必須爲動態生成的內容添加/添加類。 Jquery會使這更容易。 '$（「yourElem」）.addClass（「newClass」）;'只需將它與您創建按鈕綁定即可。 – Illdapt

@blazerix這是一個風格問題，你必須設計它忽略js。這是一個簡單的例子：http://codepen.io/anon/pen/QKgBzP但是最好查看一下html結構 – Tobia

你可以看一下按鈕的家長和強制刪除：

var elem = document.getElementById("yourid"); 
    elem.parentElement.removeChild(elem);

在創造另一個repeatableX，你也將只是針對該容器的創建按鈕我假設。

在那個按鈕上點擊你會看到按鈕的父母ID，在你的情況下，repeatableX，然後告訴它刪除那個父母，類似於上面的代碼片段。

來源

2016-09-28 16:54:13 Illdapt

託比亞的答案比較完整，跟他一起去吧。 – Illdapt

我知道stackoverflow建議反對題外帖子......但謝謝你的迴應！ – blazerix

如何在javascript/jquery中刪除動態創建的元素？

回答

相關問題