Question

我使用ajax显示数据

$.ajax({
url: "ajs/index",
type: "GET",
dataType: "JSON",
success: function(data) {  
  var output="";
      for(i=0;i<data.length;i++)
    {
           output+="name:"+data[i].name
           +"<input type='button' class='delete' value='Delete'  data-id=" + data[i].id + "><br>"

     }
     $("#result").html(output); 
    }   //success function closed
});  //ajax call closed

   // when delete button is clicked.
           $(document).on("click", ".delete", function(){
                 var id = $(this).data('id');
                $.ajax({
                    url: "ajs/"+id,
                    type: "delete", 
                    //data: "22",       
                    //dataType: "html",
                    success:function(data) { 
                        alert("success")
                    },
                    error: function(){
                        alert("error")
                    }
                }); // delete  ajax() closed
                return false;
           });//delete click() closed

我显示了一组记录，每条记录都有一个删除按钮。当我点击该按钮时，应调用上述功能。当我看到我的控制台时，它会触发两次。首先它显示deleting ajs/idno.，然后显示ajs/idno. 404 not found错误。

最糟糕的是，即使在删除记录后它显示错误消息。它没有显示成功消息。

Answer 1

每次调用click时，您似乎都在设置ajs/index事件。

您应该将click事件放在此ajax之外，并将其写为：

$(document).on("click", ".delete", function(){
    var id = $(this).data('id');
    $.ajax({
        url: "ajs/" + id,
        type: "delete", 
        success: function(data) { 
            alert("success")
        },
        error: function() {
        }
    }); // delete  ajax() closed
    return false;
}); //delete click() closed

如果动态创建具有.delete类的元素，它将起作用。

Answer 2

你可以

$(".delete").unbind("click");

将事件附加到$（＆＃34; .delete＆＃34;）。

.ajax（）触发两次

2 个答案: