Javascript Remove（）不处理新元素

我正在做一个简单的任务清单。它主要是工作和完成。单击列表元素时，对象将被删除，您可以通过底部的文本输入创建新的列表元素。唯一的问题是，由于某种原因，当您单击新的列表元素时，它们无法被删除

代码如下：

$（文档）.ready（函数（）{
$（“li”）。单击（函数（）{
$（this.remove（）；
});
$（“按钮”）。单击（函数（）{
var entry=$（“#entry”）.val（）；
$（“
”{
文本：条目
}).附于（“#列表ul”）；
$（“#分录”）.val（“”）；
});
});

由于新的

li

元素是动态创建的，因此您需要使用事件委派将事件处理程序注册到这些元素

试试这个

$("#list ul").on('click','li',function(){
        $(this).remove();
});

试试这个：

$("#list").on("click","li",function(){
        $(this).remove();
});

这工作正常：

$(document).ready(function(){

  $(document).on('click','li',function(){
     $(this).remove();
  });

  $("button").click(function(){
     var entry = $("#entry").val();
     $("<li></li>", {
        text: entry
     }).appendTo("#list ul");   
     $("#entry").val("");
  });

});

$（文档）.ready（函数（）{
$（文档）。在（'click'，'li'，函数（）上{
$（this.remove（）；
});
$（“按钮”）。单击（函数（）{
var entry=$（“#entry”）.val（）；
$（“
”{
文本：条目
}).附于（“#列表ul”）；
$（“#分录”）.val（“”）；
});
});

小提琴连接：-

---

或

$（文档）.ready（函数（）{
$（文档）。在（'单击'，'列表li'，函数（）上{
$（this.remove（）；
});
$（“按钮”）。单击（函数（）{
var entry=$（“#entry”）.val（）；
$（“
”{
文本：条目
}).附于（“#列表ul”）；
$（“#分录”）.val（“”）；
});
});

$（“#列表”）。在（“单击”、“li”，function（）{}）上也不是不起作用的
remove（）
。。。没有调用的是click事件处理程序……您必须将事件处理程序重新分配给新创建的元素<代码>http://jsfiddle.net/iMaverick/7psqndwL/28/

这很有效。非常感谢。你知道为什么上面的方法和这个方法不一样吗？@user3317470你的代码不起作用，因为它最初选择inital

li

，然后保存它们。单击它们时，它们将正确删除。但是当添加新的选择器时，初始的

li

选择器不会更新@SridharR的代码检查所有当前的

li

s以及任何新的。@user3317470检查更新数据和信息。@eclectist感谢s:\

$(document).ready(function(){

  $(document).on('click','li',function(){
     $(this).remove();
  });

  $("button").click(function(){
     var entry = $("#entry").val();
     $("<li></li>", {
        text: entry
     }).appendTo("#list ul");   
     $("#entry").val("");
  });

});

 $(document).ready(function(){

  $(document).on('click','#list li',function(){
     $(this).remove();
  });

  $("button").click(function(){
     var entry = $("#entry").val();
     $("<li></li>", {
        text: entry
     }).appendTo("#list ul");   
     $("#entry").val("");
  });

});