Jquery: 无法动态删除创建的元素

Question

Jquery: 无法动态删除创建的元素

5

我正在尝试删除一个动态添加的元素，但似乎为该元素附加的类函数未被读取。

我可以点击“+”按钮并添加新元素，但是当我点击“-”按钮时无法删除。

<div id="dftenglist">
     <label for="dtfeng">Name:</label><input type="text" class="dfteng"> 
      <button id="plusdfteng">+</button> 
</div>

$("#plusdfteng").click(function() {
  $("#dftenglist").append('<br><span><label for "a">Name:</label><input type="text" class="dfteng"> <button class="minusbtn">-</button></span>'); 
});

$(".minusbtn").click(function() {
  $(this).parent().remove();
})

http://jsfiddle.net/0uv4k5bz/1/

Thanks, Alex

- Alex Palombo

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Rajaprabhu Aravindasamy · Accepted Answer

尝试在此上下文中使用事件委托，

$("#dftenglist").on("click", ".minusbtn", function() {
  $(this).parent().remove();
});

演示

为什么要这样做？原因是，当我们注册事件到特定元素时，由于我们是在运行时添加它，该元素将不会在DOM中可用。所以，在这种情况下，事件委托将利用事件冒泡的概念来解决此问题。欲了解更多信息，请阅读此处。

对于您的新要求，只需按以下方式操作，删除父元素时同时删除<br>标签。

$("#dftenglist").on("click", ".minusbtn", function () {
    $(this).parent().prev('br').addBack().remove();
});