如何使用jquery銷燬動態創建的DOM元素？

我正在用一些表單元素在span中創建一個動態span，並創建帶有data-id的按鈕，同樣動態地通過jquery append在span #add_more中。我想在點擊該跨度的按鈕時刪除特定的跨度。如何使用jquery銷燬動態創建的DOM元素？

Step1。

<input type="button" value="Add More" id="more_size"> 
<span id="add_more"></span>

2.Clicked添加更多按鈕： -

<input type="button" value="Add More" id="more_size"> 
<span id="add_more"> 
    <span id="1001"><input type="text" name="price[]"> 
    <button data-id="1001" type="button">X</button></span> 
</span>

3.當點擊按鈕，ID爲1001的跨度ID 1001應使用jQuery刪除刪除（）。

<input type="button" value="Add More" id="more_size"> 
<span id="add_more"></span>

我是新來的堆棧溢出。這是我可以解釋我的問題的最佳方式。

來源

2014-12-20 royleewheels

你有'X'按鈕上的點擊處理程序嗎？如果是這樣，它將是該處理程序中的$（this）.parent（）。empty（）'。 –

使用這樣的：使用spanid

function removeSpan(spanId) { 
    $("#"+spanId).remove(); 
}

呼叫removeSpan。

通過ID，你可以這樣做：

$('button').on('click',function(){ 
    id = $(this).data('id');// since your data-id and span id are same 
    removeSpan(id); 
});

或在創建它自己的時間，你可以添加功能，並通過您已分配的ID。

來源

2014-12-20 11:32:09

那麼你如何獲得'spanId'？我想這是問題的關鍵點 –

嗨狼參考下面的回答 – muni

如果你正在創建跨度，那麼大概你可以控制它的'id'是什麼。但是你沒有告訴我們你是如何創建它的。或者，如果你正在創建一個jQuery對象，你可以使用該對象來代替'$（「＃」+ spanId）'。 –

對按鈕通用類獲得點擊的按鈕的數據ID ...

<span id="add_more"> 
    <span id="1001"><input type="text" name="price[]"> 
    <button data-id="1001" type="button" class='remove_class'>X</button></span> 
</span>

添加單擊事件偵聽到該按鈕使用它類（remove_class）。

$(document).on('click','.remove_class',function(){ 
    id = $(this).data('id'); 
    $('#'+id).remove(); 
});

您可以添加任意數量的跨度。使用類獲取當前點擊按鈕非常容易。

來源

2014-12-20 11:41:55 muni

雅聲聽起來不錯，但如果OP想要刪除''，聽起來不錯，但是不清楚。他提供的HTML標記暗示ya，但沒有提及有關它的問題。 –

如果刪除跨度，那麼跨度內的所有內容都將被刪除... – muni

或者如果要刪除特定於該文本框分配它的id這樣 ...然後刪除像這樣$（'＃txt _'+ id ）。去掉（）; – muni

你可以簡單的使用方法prev()：如果你想刪除的按鈕以及

$("#add_more").on("click", "button", function() { 
    $(this).prev().remove(); 
});

，您可以使用addBack()：

$("#add_more").on("click", "button", function() { 
$(this).prev().addBack().remove(); 
});

我不建議手動生成id「 s，data-*屬性等（如果上面提到的是產生它們的唯一目的，），通常你可以避免使用普通類和適當的方法。

來源

2014-12-20 12:00:25

如何使用jquery銷燬動態創建的DOM元素？

回答

相關問題