$ (это) внутри успеха AJAX не работает

Я пытаюсь изменить старый код, который использует onclick, так что я использую $(this). Проблема в том, что $(это) не работает, когда внутри успеха. Есть ли способ сделать это, не устанавливая его как var.

$('.addToCart').click(function() {

    $.ajax({
        url: 'cart/update',
        type: 'post',
        data: 'product_id=' + $(this).attr("data-id"),
        dataType: 'json',
        success: function(json) {

            if (json['success']) {

            $(this).addClass("test");

            }   
        }
    });

});

ОТВЕТЫ

Ответ 1

проблема

Внутри обратного вызова this относится к объекту jqXHR вызова Ajax, а не к элементу, к jqXHR привязан обработчик событий. Подробнее о том, как this работает в JavaScript.

Решения

Если доступно ES2015+, то использование функции стрелки, вероятно, будет самым простым вариантом:

$.ajax({
    //...
    success: (json) => {
         // 'this' refers to whatever 'this' refers to outside the function
    }
});

Вы можете установить параметр context:

Этот объект станет контекстом всех обратных вызовов, связанных с Ajax. По умолчанию контекст представляет собой объект, который представляет параметры ajax, используемые в вызове ($.ajaxSettings объединенные с параметрами, переданными в $.ajax). (...)

$.ajax({
    //...
    context: this,
    success: function(json) {
         // 'this' refers to the value of 'context'
    }
});

или используйте $.proxy:

$.ajax({
    //...
    success: $.proxy(function(json) {
         // 'this' refers to the second argument of '$.proxy'
    }, this)
});

или сохранить ссылку на значение this вне обратного вызова:

var element = this;

$.ajax({
    //...
    success: function(json) {
         // 'this' refers to the jQXHR object
         // use 'element' to refer to the DOM element
         // or '$(element)' to refer to the jQuery object
    }
});

Связанный

Ответ 2

jQuery(".custom-filter-options .sbHolder ul li a").each(function () {
    var myStr = jQuery(this).text();
    var myArr = myStr.split(" (");
     url = 'your url'; // New Code
            data = myArr[0];
                try {
                    jQuery.ajax({
                        url : url,
                        context: this,
                        type : 'post',
                        data : data,
                        success : function(data) {
            if(data){
                  jQuery(this).html(data);
            }else{
                  jQuery(this).html(myArr[0]);
            }
                        }
                    });
                } catch (e) {
                } 


});