通過.remove（）移除父div。

我試圖使用jQuery刪除<button>標記的父div按下時。我有這樣的HTML代碼：通過.remove（）移除父div。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"> 
</script> 
<script> 
    $(".remove").click(function(event) { 
     event.preventDefault(); 
     $(this).parents('.li').remove(); 
    }); 
</script> 
<div id="1a"> 
    <input class="versionid" placeholder="Version Number"><button class="add">+</button><button class="remove">X</button><br> 
    <br> 
    <textarea class="textarea" placeholder="Changes"></textarea> 
</div>

jQuery的代碼應該刪除整個<div id="1a">塊，但好像沒有什麼改變。

來源

2016-06-21 Julian Lachniet

$(this).parents('.li').remove();中的選擇器指的是您嘗試選擇的父級。這應該爲$(this).parents('#1a').remove();，請注意從'.li'到'#1a'的更改，因爲父分區的ID爲1a。這裏的的jsfiddle：

https://jsfiddle.net/9jLsz6r2/

或者，你可以使用$(this).parent().remove()，如果您有多個刪除按鈕

來源

2016-06-22 00:01:15 Jay

如果有一個div是.remove的兄弟，並且與＃1a的ID不同，那麼這是行不通的 - 如果OP在當前有不同的HTML ... –

也是'$（this ）.parent（）...'如果它不是直接的'parent'，也將是一個*失敗*。 –

1.不要鹹。 2.目前'＃1a'不是'.remove'的兄弟，它是父母。不應該有多個具有相同ID的元素，如果存在，那麼您應該重命名它們，或者使用一個類 - 這不是適當的解決方案。 3。它不是_fiasco_，如果它不是直接父對象，則可以鏈接parent（），直到選擇了正確的元素爲止; 4.如果在不同地方使用此偵聽器來處理按鈕，則應確保它們的行爲完全一樣。您的評論僅僅是爲了報復我對你的答案的完全合理的建議。 – Jay

似乎是一個奇怪的父母刪除...因爲.parents('.li')，這可能是更容易不存在 。

<div class="YOU DON'T HAVE ANY CLASS" id="1a">

也許http://api.jquery.com/closest/：

$(this).closest('div').remove();

或而分配li類的DIV：

$(this).closest('.li').remove();

，如：

$(".remove").click(function(event) { 
 
    event.preventDefault(); 
 
    $(this).closest('div').remove(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="li" id="1a"> 
 
    <input class="versionid" placeholder="Version Number"><button class="add">+</button><button class="remove">X</button><br> 
 
    <br> 
 
    <textarea class="textarea" placeholder="Changes"></textarea> 
 
</div>

你可以從有用的意見看，確保使用更具體的選擇比.closest("div")，也許就像一個類：.closest(".parent")甚至.closest(".li")，但不是一定要使用該類<div class="li" id="1a">

來源

2016-06-22 00:02:04

如果有一個div是'.remove'的兄弟，如果OP想要更改他們HTML在未來 – Jay

**謝謝**。On point。@Wade –

只是說.OP似乎不太熟悉JS/HTML/CSS，所以他們可能會發現這個有用 – Jay

只需使用.closest（）方法：$（this）.closest（'。li'）。remove（）; 它從當前元素開始，然後爬上鍊尋找一個匹配元素，一旦找到匹配元素就停下來。

.parent（）只訪問元素的直接父級，即與div.msg-modification不匹配的.li。所以它永遠不會達到你正在尋找的元素。

除.closest（）（它檢查當前元素然後爬上鍊）之外的另一個解決方案是使用.parents（） - 但是，這會有一個警告，即它一找到匹配元素（並且它不檢查當前元素，但僅檢查父元素）。在你的情況下，它並不重要，但對於你正在嘗試做的事情來說.closest（）是最合適的方法。

來源

2016-06-22 00:20:26 AK1

通過.remove（）移除父div。

回答

相關問題