Làm cách nào để tham chiếu đến phần tử dom gọi trong hàm thành công jquery ajax?

Question

Tôi đang cố gắng để sửa đổi các lớp của một phần tử nếu một cuộc gọi ajax dựa trên yếu tố đó là thành công

<script type='text/javascript'> 
$("#a.toggle").click(function(e){ 
    $.ajax({ 
     url: '/changeItem.php', 
     dataType: 'json', 
     type: 'POST', 
     success: function(data,text){ 
      if(data.error=='') 
      { 
       if($(this).hasClass('class1')) 
       { 
        $(this).removeClass('class1'); 
        $(this).addClass('class2'); 
       } 
       else if($(this).hasClass('class2')) 
       { 
        $(this).removeClass('class2'); 
        $(this).addClass('class1'); 
       } 
      } 
      else(alert(data.error)); 
     } 
    }); 
    return false; 
}); 
</script> 
<a class="toggle class1" title='toggle-this'>Item</a> 

sự hiểu biết của tôi về vấn đề là trong hàm thành công này tham khảo các thông số đối tượng ajax, KHÔNG phải phần tử dom gọi như nó nằm trong các vị trí khác của hàm nhấp chuột. Vì vậy, làm thế nào để tôi tham khảo các yếu tố dom gọi và kiểm tra/thêm/loại bỏ các lớp học?

Answer 1

Bạn chỉ có thể lưu trữ nó trong một biến. Ví dụ:

$("#a.toggle").click(function(e) 
{ 
    var target = $(this); 
    $.ajax({ 
     url: '/changeItem.php', 
     dataType: 'json', 
     type: 'POST', 
     success: function(data,text) 
     { 
     if(data.error=='') 
     { 
      if(target.hasClass('class1')) 
      { 
       target 
        .removeClass('class1') 
        .addClass('class2'); 
      } 
      else if(target.hasClass('class2')) 
      { 
       target 
        .removeClass('class2') 
        .addClass('class1'); 
      } 
     } 
     else(alert(data.error)); 
     }  
    }); 
    return false; 
}); 

Answer 2

jQuery chuyển mục tiêu của sự kiện, cùng với một số thông tin khác về sự kiện đến chức năng xử lý của bạn. Xem http://docs.jquery.com/Events_%28Guide%29 để biết thêm thông tin về điều này.

Trong mã của bạn, nó sẽ được tham chiếu như $ (e.target).

Answer 3

Tôi biết nó cũ nhưng bạn có thể sử dụng tham số 'e' từ hàm nhấp chuột.

Answer 4

Thông số ajax đặt tốt hơn: context: this. Ví dụ:

$.ajax({ 
    url: '/changeItem.php', 
    dataType: 'json', 
    type: 'POST', 
    context: this, 
    success: function(data,text){ 
     if(data.error=='') 
     { 
      if($(this).hasClass('class1')) 
      { 
       $(this).removeClass('class1'); 
       $(this).addClass('class2'); 
      } 
      else if($(this).hasClass('class2')) 
      { 
       $(this).removeClass('class2'); 
       $(this).addClass('class1'); 
      } 
     } 
     else(alert(data.error)); 
    } 
});