Question

我正在尝试将$ this变量添加到成功中。我尝试了很多方法，但它没有按预期工作。这是我的代码

$(document).on('click', '.add-cart-button',function(){

    $(this).find('button').find('i').attr('class', 'fa fa-spinner fa-pulse fa-fw');

    var productdetails = $(this).closest('.product-cart-details');

    var productdata = {
        'itemid' : productdetails.data('productid')
    }

    var cartbutton = $(this);
    $.ajax({
        url: productdetails.data('addtocarturl'), 
        type: 'POST',
        headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
        data: productdata,
        dataType: 'JSON',
        success: function(data){
            cartbutton.find('button').find('i').attr('class', 'fa fa-check');    <-------------------here is the problem. $(this) is not working
        },
        error: function(data){
            console.log(data)
        }
    });

});

我不确定，我们是否可以在另一个函数中调用$(this)。但我需要弄清楚这一点。

谢谢（提前）！

Answer 1

是的，您可以使用context option

$.ajax({
    context: this,
    url: productdetails.data('addtocarturl'), 
    type: 'POST',
    headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
    data: productdata,
    dataType: 'JSON',
    success: function(data){
        $(this).find('i').attr('class', 'fa fa-check');
    },
    error: function(data){
        console.log(data)
    }
});

Answer 2

有几种方法可以做到这一点。但我使用以下代码：

$.ajax({
        url: productdetails.data('addtocarturl'), 
        type: 'POST',
        headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
        data: productdata,
        dataType: 'JSON',
        success: function(data){
            $(this).find('button').find('i').attr('class', 'fa fa-check');    <-------------------here is the problem. $(this) is not working
        }.bind(this),
        error: function(data){
            console.log(data)
        }
    });

在函数绑定对象之后，您可以在函数内使用$（this）。祝你好运！

在SUCCESS函数中用$（this）参数调用AJAX

2 个答案: