Question

当我在列表中添加新的<li>，然后我尝试删除它时，它不会让我从列表中删除新添加的功能？

干杯

Answer 1

你可以试试。

    $(function(){
      $('#cblist a').live('click', function(){
        $(this).parent('li').remove();
        return false;
      });
    });

Answer 2

当浏览器正在读取您的javascript代码时，动态添加的li不在DOM中，因此无法找到它。而是将处理程序添加到父级，并监听如下：

$('#cblist').on('click', 'a', function(){
    $(this).parent('li').remove();
    return false;
});

小提琴： http://jsfiddle.net/43nWM/3/

Answer 3

您只是将点击事件绑定到当前的“删除”链接，而不是将来的链接。为此使用事件委托，以涵盖两个基础。变化：

  $('#cblist a').click(function(){

到

  $('#cblist').on('click', 'a', function() {

Answer 4

这里的秘密是事件委托。当您致电.click(function() {...})或.on('click', function() {...})时，事件处理程序仅分配给与代码运行时匹配选项的元素。它不会影响以后添加的元素。

但是，您可以使用事件委派将事件处理程序分配给包含所有动态元素的静态元素，只要与动态选择器匹配的元素触发该类型的事件，它就会运行回调函数：

$('#cblist').on('click', 'a', function() {
    $(this).parent('li').remove();
    return false;
});

有关详情，请参阅.on()功能文档中标题为直接和委派活动的部分。

Answer 5

$(function(){
     $('#cblist').on('click','a',function(){
         $(this).parent('li').remove();
         return false;
     });
});

查看此jsfiddle

Answer 6

另一种选择是使用on（）函数，如下所示：http://jsfiddle.net/43nWM/12/

说实话，我其实更喜欢其他两种解决方案。

编辑：使用on（）代替。我最初建议使用live（）

Answer 7

您应该添加此代码以添加动态li代码

$li = $('<li>'+name+'</li>');
$a = $('<a href="">remove</a>');
        $a.click(function(){
          $(this).parent('li').remove();
          return false;      
        });
$li.append($a);

我还更新了jsfiddle上的代码

jQuery Cant删除li一旦添加

7 个答案: