2011-04-13 155 views
1

我在jquery中有用於刪除以前的div標記和下一個.pclass的代碼。 繼承人我的代碼:jquery不刪除元素

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

        } 

        }); 
      } 
     }); 

當我使用remove方法調用$就功能之前,它的工作不錯,但不是當我把它裏面的成功。我檢查了servlet文件返回的輸出。它工作正常。有任何想法嗎?

+0

不爲$範圍(本)進行更改,則成功在函數內部? – 2011-04-13 13:13:59

回答

2

您必須存儲上下文中的變量,並傳遞到成功的功能,像這樣:這裏

$.ajax({ 
    ... 
    context: this, // set the context for all ajax-related callbacks 
    success: function(data) { 
     $(this).next('.pclass').remove(); 
    } 
}); 
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(); 
} 
1

你失去範圍「這個」當你在成功的功能是。您可以將$(this)設置爲一個變量並傳遞該變量。

1

我想象一下,成功回調裏面的this可能不會引用點擊元素,因爲它在ajax調用之外。將這些成功行移入它們自己的函數中,從成功調用函數並在這些行中的螢火蟲中彈出一個斷點,以查看this是什麼。

1

問題,因爲上下文:

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

或者,你可以使用$.ajax's context option這在執行成功處理程序時會發生變化。 使用這個技巧。

嘗試下面的代碼:

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

        } 

        }); 
      } 
     });