jQuery发布成功数据不在DOM中

Question

我的问题是以下问题，jQuery Post成功方法返回一些数据，该数据是我正在添加到div的数据，但看来我正在添加的数据不在DOM中。

jQuery邮政编码：

$('#form').submit(function() {

  var text = $("#input").val();

  $.ajax({
     type: "POST",
     url: "file.php",
     data: "name=" + text,
     success: function(data) {
      $("#app").prepend("<span class='delete'>" + data + "</span>");
     }
  });

    return false;
});

这是删除跨度但不删除前置元素的代码。

$('.delete').on('click' , function() {

    $(this).hide();

});

Answer 1

问题是绑定click处理程序时， span元素不存在，因此不会触发事件处理程序。 您需要使用事件委托来捕获尚不存在的元素上的事件：

$('#app').on('click', '.delete', function() {
    $(this).hide();
});

现在，该处理程序已绑定到#app ，它将始终存在。 源自子元素的事件会“冒泡”，并在其父元素上触发，因此，如果原始元素与.delete匹配，则绑定到#app后代元素的所有click事件#app触发此处理程序。