jQuery不能删除li一旦添加

问题描述：

当我添加一个新的<li>到列表中，然后我尝试删除它，它不会让我从列表中删除新增功能？jQuery不能删除li一旦添加

干杯

不是针对你的问题的代码，但请注意，我正在使用Chrome，所以我可以告诉你：'未捕获的类型错误：对象[对象对象]没有方法'可排序' – 2012-08-03 11:21:12

答

因为当浏览器阅读你的JavaScript代码动态添加的李不在DOM，所以它不能找到它。相反，处理程序添加到父，并听取这样的一个：

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

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

我有一种方法可以有一个链接说“全部删除”，然后警报出现与你确定吗？是/取消。那么为了删除左边列表中的所有li？ – Paul 2012-08-03 12:17:03

答

您的点击事件绑定只是现在的“删除”链接，而不是未来的。使用事件代表团来解决这个问题。更改：

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

到

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

答

这里的秘密是事件委托。当您拨打.click(function() {...})或.on('click', function() {...})时，事件处理程序仅分配给与代码运行时选择器匹配的元素。它不会影响稍后添加的元素。但是，您可以使用事件委托将事件处理程序分配给静态元素，该静态元素将包含所有动态元素，只要匹配动态选择器的元素触发该类型的事件，该动态元素就会运行回调函数：

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

请查看的部分关于.on()函数的文档中的直接和委托事件以获取更多信息。

答

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

查看此jsfiddle

让javascript监听每一次点击，然后在整个DOM中搜索'#cblist a'并不是一个好主意。但是，它会工作。 – ninja 2012-08-03 11:22:13

哦，是啊..我知道..我会编辑我的答案 – 2012-08-03 11:23:37

答

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

说实话，其实我喜欢这里的其他两种解决方案虽然。

编辑：用（）代替。我原先建议用live（）

'.live（）'函数已被弃用**月**，所以没有人应该编写使用它的新代码。 – 2012-08-03 11:22:38

live函数不应该使用..因为它已被弃用，它不是很好的性能明智的原因 – 2012-08-03 11:25:00

@ParvSharma在实践中，调用'$（'selector'）。live（'event'，function（）{.. 。}）在jQuery 1.7+中会调用'$（document）.on（'event'，'selector'，function（）{...}）'。不使用弃用函数的主要原因是它们理论上可以从未来的版本中删除，破坏你的代码。 – 2012-08-03 11:27:00

答

你可以试试。

http://jsfiddle.net/43nWM/1/

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

活功能不应该使用 – 2012-08-03 11:25:18

.live（）方法已弃用，您可以在jQuery文档中看到 – 2012-08-03 11:25:47

答

应将此代码添加到除动态li标签

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

我也更新上的jsfiddle

jQuery不能删除li一旦添加

相关推荐