多个AJAX onclick调用仅对一个项起作用

这是我的HTML：

<div class='delete-item' name='filetest' ></div>
<div class='delete-item' name='anothertest' ></div>
<div class='delete-item' name='coolfile' ></div>

还有我的JavaScript

$(".delete-item").click(function() {

    $.ajax({
        type: "GET",
        url: "delete_item.php",
        data: "name="+$(this).attr("name")+"&dir=<?php echo $encodedDirectory; ?>",
        success: function(data) {
            refreshItemList();
        }
    });

});

$（“.delete item”）。单击（函数（）{
$.ajax({
键入：“获取”，
url:“delete_item.php”，
数据：“name=”+$（this）.attr（“name”）+“&dir=”，
成功：功能（数据）{
refreshItemList（）；
}
});
});

---

因此，代码可以工作，但只适用于一项。无论我首先单击哪一个，ajax调用都会成功完成。但是，单击另一个甚至不会调用该函数（我尝试将其记录到控制台，除了第一项之外，它甚至没有记录任何内容。）

尝试使用jQuery.live而不是bind：

$(".delete-item").live('click', function() {

执行

$（“.delete item”）。单击（…）

jquery会将事件附加到页面上的所有

.delete item

元素。但是在

refreshItemList（）中将它们替换为新的，并且没有事件处理程序附加到新的事件处理程序

jQuery.live（）
在所有匹配
的元素上附加事件。在调用时删除项目
，也删除
。删除调用后创建的项目。
谢谢！工作完美，现在我明白了问题所在。当我调用refreshItemList（）时，它正在重新加载删除按钮所在的列表。