删除AJAX添加的HTML

Question

我有一个页面,我建立订单.该页面完全与ajax一起使用以查找产品并将其添加到页面中.

现在,如果你添加一个项目并需要删除它,我正在构建这样做的功能:

$('.orderRemove').click(function() {
    var removeID = $(this).attr("id");
    $("#item-" + removeID).remove();
    calculateTotal();
});

但是因为.orderRemove是由AJAX添加的,所以它不起作用.

如何进行这个确切的调用工作,删除ajax添加的完整块.

谢谢

Answer 1

原因是动态添加HTML到DOM不会将自身附加到事件处理程序,因此要么在ajax成功回调中重新附加事件处理程序,要么尝试.delegate使用jQuery版本少于1.7或者.on如果您使用的是jQuery 1.7或者更高

$(document).delegate('.orderRemove','click',function() {
    var removeID = $(this).attr("id");
    $("#item-" + removeID).remove();
    calculateTotal();
});

.on的例子

$(document).on('click','.orderRemove',function() {
   var removeID = $(this).attr("id");
   $("#item-" + removeID).remove();
  calculateTotal();
});