更好的方式從列表中刪除元素？

Question

我將有一個無序列表（<UL>）的項目。每個項目將有一個刪除按鈕，這將使ajax調用&然後從列表中刪除項目。我擁有所有需要進行Ajax調用的信息，但我想知道讓用戶刪除列表中的任何項目的最佳方法。

我的第一個想法是動態分配每個<LI>一個獨特的類標識符&然後在每個元素上使用jQuery的remove()，但是有沒有更好的方法？我有一種感覺，我的方法有點受挫。

Answer 1

沒有必要創造一些獨特的類名（你的意思是唯一的標識符，是吧？id，不class）。

只需使用單擊的按鈕即可找到其父母li。

$('li .delete_button').click(function() { 
    var that = this; 
    $.post(url, data, function(data) { 
    if(data.can_delete) { 
     $(that).parent('li').remove(); 
    } 
    }); 
}); 

Answer 2

我根本沒有發現你的方法有什麼問題。您可以使用數據集屬性，如<li data-unique-id="">，甚至是id，而不是使用類。

$("ul").on('click', 'li', function() { 
    $.post('remove-script', 'id=' + this.id, function() { 
     $(this).fadeOut(function() { $(this).remove(); }); 
    }); 
}); 

Answer 3

HTML

<ul> 
    <li>TEXT <input type="button" value="Delete" data-id="1" /></li> 
    <li>TEXT <input type="button" value="Delete" data-id="2" /></li> 
    <li>TEXT <input type="button" value="Delete" data-id="3" /></li> 
</ul> 

和腳本

$("ul li input").click(function() { 
    //ajax call on $(this).data('id'); 
    $(this).closest("li").remove(); 
}); 

Answer 4

1，刪除li元素，其標題被刪除...

$("ul li").remove("li[title==delete]"); 

2，刪除第二個li元素

var $li=$("ul li:eq(1)").remove();