Jquery：ajax成功后删除DOM元素答案

【问题标题】：Jquery:Remove DOM element after ajax successJquery：ajax成功后删除DOM元素
【发布时间】：2014-03-21 14:39:48
【问题描述】：

在 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 工作正常但是当涉及到“成功：”部分时它不会删除元素。

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

$("#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
});

有人能解释一下为什么会这样吗？谢谢

【问题讨论】：

你确定成功回调被触发了吗？
是的，很确定.. 在控制台上返回 200OK
你确定你的“成功”处理程序真的被调用了吗？可以在里面添加console.log或者断点来验证吗？
你确定那个元素是一个 jQuery 对象吗？如果不是，你应该这样做$(element).remove();
@NEWBIE 原因很多，也许你应该看看你的服务器脚本...

标签： javascript jquery ajax dom

【解决方案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();
    }   
}); 
}

【讨论】：

我认为在你的成功函数上你应该做t.remove();而不是$(t).remove();，因为你定义了t=$(element)，所以它已经是一个jQuery对象了。
控制台中的任何错误。尝试在成功功能上发出警报。
@vekah: $(element) 将返回 jquery 对象。是的，你需要 $(t) 才能访问它。
@MilindAnantwar 不，vekah 是正确的，不需要包裹两次

【解决方案2】：

解决方案： 问题实际上出在服务器端..如果您依赖成功事件，您的服务器端必须始终返回一个 json ..即使它为空或您喜欢什么。因为只有在

的情况下才会触发成功

<?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，则此方式将触发成功..

【讨论】：