jquery没有删除元素

时间:2011-04-13 13:08:35

标签: jquery ajax

我在jquery中有代码,用于删除前一个div标签和下一个.pclass。 继承我的代码:

 $(".delete").bind("click",function(){
             var c = confirm("You sure want to delete this?");
             if(c){
                /* $(this).next('.pclass').remove();
                 $(this).prev('.rurl').remove();
                 $(this).remove();*/
                 var text = $(this).prev('.rurl').text();
                 var idvalue = $(this).prev('.rurl').attr('id');
                 var id = idvalue.split("|");

                 $.ajax({
                        type: "POST",
                        url: "http://localhost:8080/cPEP_UI/Engine_rurl_delete",
                        data: "text="+text+"&eid="+id[1],
                        dataType: "json",
                        success: function(data) {
                            if(data.update == "success"){
                                $(this).next('.pclass').remove();
                                 $(this).prev('.rurl').remove();
                                 $(this).remove();
                            }
                            // $('#show').show();
                            //$('#show').html(data.update+" "+data.message).fadeOut(8000);
                        },
                    error:function(xhr,err){
                      //alert("readyState: "+xhr.readyState+"\nstatus: "+xhr.status);
                       $('#show').show();
                      // alert(xhr.responseText);
                       $('#show').html("responseText: "+xhr.responseText);

                    }

                    }); 
             }
         });

当我在调用$ .ajax函数之前使用remove方法时,它正常工作,但是当我将其置于成功之后。我检查了servlet文件返回的输出。它工作正常。有什么想法吗?

6 个答案:

答案 0 :(得分:2)

您必须将上下文存储在变量中并将其传递给success函数,如下所示:

var that = $(this);
$.ajax({
    ...
    success: function(data) {
        that.remove();
    }
});

或者,您可以使用$.ajax's context option

$.ajax({
    ...
    context: this, // set the context for all ajax-related callbacks
    success: function(data) {
        $(this).next('.pclass').remove();
    }
});

答案 1 :(得分:1)

在ajax.success方法this中没有指向你的元素。

添加类似的代码

var self = this;
var c = confirm("You sure want to delete this?");

然后

if(data.update == "success"){
    $(self).next('.pclass').remove();
    $(self).prev('.rurl').remove();
    $(self).remove();
}

答案 2 :(得分:1)

当你处于成功功能时,你正在失去“这个”的范围。您可以将$(this)设置为变量并传递变量。

答案 3 :(得分:1)

我认为成功回调中的this可能不会引用被点击的元素,因为它在ajax调用之外。将这些成功行移动到他们自己的函数中,从成功调用函数并在firebug中弹出断点以查看this是什么。

答案 4 :(得分:1)

此处发布,因为执行成功处理程序时,此上下文会发生变化。 使用那个 - 这个技巧。

尝试以下代码:

 $(".delete").bind("click",function(){
     var c = confirm("You sure want to delete this?");
       //#################################
       //Capture the context of this so that it can be used in callbacks
     var that = $(this);
     if(c){
         var text = $(this).prev('.rurl').text();
         var idvalue = $(this).prev('.rurl').attr('id');
         var id = idvalue.split("|");

         $.ajax({
                    type: "POST",
                    url: "http://localhost:8080/cPEP_UI/Engine_rurl_delete",
                    data: "text="+text+"&eid="+id[1],
                    dataType: "json",
                    success: function(data) {
                        if(data.update == "success"){
                         //##########################
                         //Since the context of this was stored in that, use it. 
                         that.next('.pclass').remove();
                         that.prev('.rurl').remove();
                         that.remove();
                        }
                    },
            error:function(xhr,err){
                 $('#show').show();
                 $('#show').html("responseText: "+xhr.responseText);
            }
        }); 
  }
});

答案 5 :(得分:1)

$(".delete").bind("click",function(){
             var c = confirm("You sure want to delete this?");
             if(c){
                /* $(this).next('.pclass').remove();
                 $(this).prev('.rurl').remove();
                 $(this).remove();*/


                 var myElement = $(this);


                 var text = $(this).prev('.rurl').text();
                 var idvalue = $(this).prev('.rurl').attr('id');
                 var id = idvalue.split("|");

                 $.ajax({
                        type: "POST",
                        url: "http://localhost:8080/cPEP_UI/Engine_rurl_delete",
                        data: "text="+text+"&eid="+id[1],
                        dataType: "json",
                        success: function(data) {
                            if(data.update == "success"){
                                myElement.next('.pclass').remove();
                                myElement.prev('.rurl').remove();
                                myElement.remove();

                                //$(this).next('.pclass').remove();
                                //$(this).prev('.rurl').remove();
                                //$(this).remove();
                            }
                            // $('#show').show();
                            //$('#show').html(data.update+" "+data.message).fadeOut(8000);
                        },
                    error:function(xhr,err){
                      //alert("readyState: "+xhr.readyState+"\nstatus: "+xhr.status);
                       $('#show').show();
                      // alert(xhr.responseText);
                       $('#show').html("responseText: "+xhr.responseText);

                    }

                    }); 
             }
         });