Jquery：Ajax成功后删除DOM元素

Question

我在尝试在ajax成功后删除元素时遇到了困难。

这是我的ajax代码：

verifyRequest.denyUser = function(requestId,element){
    $.ajax({
        url: loaderURL+'idverified/denyRequest',
        dataType:"json",
        type:"post",
        data:{
            id:requestId,   
        },
        success: function(data){
            element.remove();
        }   
    }); 
}

同时监听此事件：

$("#requestUsers ul li .remove").click(function(){
    var id = $(this).attr("data-value"),
        element = $(this).parent('li');

        verifyRequest.denyUser(id,element);     
});

问题在于，Ajax工作正常，但是在“success:”部分无法删除元素。

我尝试了这段代码，它可以工作，但不符合我的需求：

$("#requestUsers ul li .remove").click(function(){
    var id = $(this).attr("data-value"),
        element = $(this).parent('li');

        verifyRequest.denyUser(id,element);
            element.remove();//and it did worked
});

有人能解释一下为什么会发生这种情况吗？谢谢

- NEWBIE

---

你确定 success 回调已经被触发了吗？ - A. Wolff

我认为成功不是被解雇，我尝试在成功处理程序上发出警报，但没有触发。 - NEWBIE

@vekah 还是一个空的 jq 对象 ;) 但无论如何，OP 说在直接设置 click 处理程序时它可以工作。 - A. Wolff

@NEWBIE 所以你的服务器没有返回有效的 JSON。 - A. Wolff

@NEWBIE 有很多原因，也许你应该查看你的服务器脚本... - A. Wolff

Answer 1

存储引用，然后将其删除。方式如下：

verifyRequest.denyUser = function(requestId,element){
var t = $(element);
$.ajax({
    url: loaderURL+'idverified/denyRequest',
    dataType:"json",
    type:"post",
    data:{
        id:requestId,   
    },
    success: function(data){
        $(t).remove();
    }   
}); 
}

- Milind Anantwar

---

我认为在你的成功函数中，应该执行 t.remove(); 而不是 $(t).remove();，因为你定义了 t=$(element)，所以它已经是一个 jQuery 对象。 - vekah

在控制台中检查是否有任何错误。在成功函数中尝试使用警报提示。 - Milind Anantwar

@vekah：$(element) 将返回 jQuery 对象。是的，你需要 $(t) 来访问它。 - Milind Anantwar

@MilindAnantwar 不用包两次，vekah是正确的。 - A. Wolff

Answer 2

解决方案： 问题实际上出现在服务器端.. 如果你依赖成功事件，则服务器端必须始终返回一个 JSON，即使它是空的或任何你喜欢的格式。因为只有在成功的情况下才会触发 success 事件。

<?php  
 if(isset($_POST['yourData']) && !empty($_POST['yourData'])){
   if(//evaluate further){
     // This will trigger success
     echo json_encode(array());
   }else{
     throw new HttpException(403,'Unauthorized request');
   }
 }else{
  throw new HttpException(404,'Not Found')
 }
?>

如果您的评估返回 true，则会触发成功。

- NEWBIE