jQuery removeClass 및 addClass가 작동하지 않음

Question

버튼을 만들었습니다. 사용자가 버튼을 클릭하면 현재 클래스를 새 클래스로 교체해야하며 그 반대의 경우도 마찬가지입니다. 하지만 addClass 또는 removeClass는 모두 효과가 나타나지 않습니다. 콘솔 로그에서 아무런 오류나 경고 메시지를 보지 못했습니다.

jQuery 코드 :

$('.vote_btn').click(function(){ 
    $.ajax({ 
     url:'/joseph/pages/votes.php', 
     type: 'post', 
     //dataType:'json', 
     data:{'comment_id':$(this).data('commentid')}, 
     success: function(data){ 
      if(data == 'up'){ 
       $(this).removeClass('fa-thumbs-o-up').addClass('fa-thumbs-up'); 
      } else if(data == 'reversed') { 
       $(this).removeClass('fa-thumbs-up').addClass('fa-thumbs-o-up'); 
      } else { 
      alert(data); 
      } 
     } 
    }); 
}); 

HTML 코드 : $(this) 더 이상 클릭 .vote_btn을 의미

<span id="<?=$comment['id']?>" class="fa fa-thumbs-o-up vote_btn" data-commentid="<?=$comment['id']?>" data-postid="<?=$getpost['post_id']?>" data-who="<?=$comment['commenter_id']?>"></span> 

Answer 1

jQuery 오브젝트. 성공 콜백 내부에서 클릭 된 버튼을 변수에 저장하고이 변수를 콜백 내부에 사용하십시오.

$('.vote_btn').click(function(){ 
    var _this = $(this); 

    $.ajax({ 
     url:'/joseph/pages/votes.php', 
     type: 'post', 
     //dataType:'json', 
     data:{'comment_id':_this.data('commentid')}, 
     success: function(data){ 
      if(data == 'up'){ 
       _this.removeClass('fa-thumbs-o-up').addClass('fa-thumbs-up'); 
      } else if(data == 'reversed') { 
       _this.removeClass('fa-thumbs-up').addClass('fa-thumbs-o-up'); 
      } else { 
      alert(data); 
      } 
     } 
    }); 
}); 

희망이 도움이 되었습니까?

Answer 2

이 작동 해보십시오 :

$('.vote_btn').click(function(){ 
    var curEvent=$(this); 
    $.ajax({ 
    url:'/joseph/pages/votes.php', 
    type: 'post', 
    //dataType:'json', 
    data:{'comment_id':$(this).data('commentid')}, 
    success: function(data){ 
     if(data == 'up'){ 
      $(curEvent).removeClass('fa-thumbs-o-up').addClass('fa-thumbs-up'); 
     } else if(data == 'reversed') { 
      $(curEvent).removeClass('fa-thumbs-up').addClass('fa-thumbs-o-up'); 
     } else { 
     alert(data); 
     } 
    } 
    }); 
    });