Jquery - .remove() 的一些问题

Question

这个问题已经有答案了:

Event binding on dynamically created elements? (23 个回答)

已关闭 6 年前。

我的 JQuery 有问题，我不明白为什么删除按钮不起作用，你能帮我吗？ =)这是我的代码:

$('.removeBook').on('click', function() {
  $('div').remove();
});

$('#createBook').click(function() {
  $('#list').append('<div>Hello' + '<button type="button" name="removeBook" class="removeBook">Remove</button>' + '</div>');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<button type="button" name="createBook" id="createBook">Create</button>
<div id="list">
</div>

如果您能帮助我，请先致谢!

Answer 1

您的 on 函数语法错误。由于它是一个动态元素，您应该在其容器和函数上注册事件，事件应该是第一个参数，第二个是选择器。

并且 ("div").remove() 删除所有 div。您应该将代码更改为

$("#list").on('click',"button.removeBook", function() {
  $(this).parent().remove();
});

Demo