Ошибка JQuery Ajax при успешном обратном вызове

Question

Я создаю кнопку, которая, когда клики что-то делают с Ajax на сервере, и когда вернется с сервера цвет кнопки, и его текст изменится (что-то вроде +1 добавить друга в facebook) здесь мой код в .js:

$(".blue").on("click", function(){ 
    var firstName = $(this).prev().prev().text(); 
    var lastName = $(this).prev().text(); 
    $(this).text("Add Friend..."); 
    var data={ 
     firstName: firstName, 
     lastName: lastName 
    }; 
    $.ajax({ 
     url: '/ajax/friendRequest', 
     data: data, 
     dataType: 'json', 
     success:function(){ 
      alert(123); 
      $(this).removeClass("glass blue"); 
      $(this).addClass("greenStatic"); 
      $(this).text("Request sent"); 
     } 
    }); 
}); 

каждая вещь в порядке и запрос будет успешно изменить базу данных, но когда это возвращение к обратному вызову я вижу только alert(123); в браузере и 3 ниже линий не запускать и мой хром инструменты разработчика исключают typeError Я ищу SO и изменяю $ знаком jQuery, но все же у меня такая же проблема

Answer 1

В вашем успехе обратного вызова $(this) не относится к кнопке, кэшировать вне обратного вызова успеха, как

$(".blue").on("click", function(){ 
    var btn = $(this); 
    ... 
    .... 
    success:function(){ 
     ... 
     btn.addClass("greenStatic"); 
     ... 
    } 
}); 

Answer 2

 $(this).removeClass("glass blue"); 
     $(this).addClass("greenStatic"); 
     $(this).text("Request sent"); 

Здесь this не относится к контролю, а это относится к Объект запроса Ajax. Итак, замените this на идентификатор элемента управления. Он должен работать.

Что-то вроде ниже ...

 $("#controlId").removeClass("glass blue"); 
     $("#controlId").addClass("greenStatic"); 
     $("#controlId").text("Request sent");