javascript - 试图删除最近创建的 div (AJAX)

Question

我正在尝试通过单击上面的删除按钮来删除#ajax-form。

有什么想法吗？

非常感谢!

Javascript:

function deleteAddLinkBox() {
  $('.container-delete-button').on('click', function(event) {
       $('#ajax-form').remove();
  });
};

HTML:

<div id="container"><div id="ajax-form"><h1>Submit a new link</h1>
<div class="container-delete-button">☒</div>
<form action="/links" method="post">    
  <p>
    <input type="text" name="url" placeholder="Url">
  </p>
etc....

Answer 1

问题是 $(".container-delete-button") 找到具有该类的元素并绑定(bind)到它们。如果元素在进行绑定(bind)时没有类，则不会处理事件。

当事件“冒泡到”父元素时，on 函数允许您通过在另一个元素上处理它们来解决这个问题。在这种情况下，我们可以说是 body 元素——您可能会选择一个更具体的公共(public)父元素。

试试这个:

$(document).on('click', '.container-delete-button', function(event) {
       $('#ajax-form').remove();
  });