javascript - jQuery 代码无法成功

Question

我有一个可以完美运行的 jQuery ajax 代码。但我需要它来更改成功单击时触发 jQuery ajax 事件的按钮的类。但我的 success: 代码不起作用。请参阅下面的代码。

jQuery 代码

    $(document).ready(function() {
        $('.btn.btn-outline.btn-sm').click(function() {
            var pollQId = $(this).val();
            $.ajax({
                type: "POST",
                url: "Default.aspx/LikePoll",
                data: JSON.stringify({ 'pollQId': pollQId }),
                contentType: "application/json; charset=utf-8",
                datatype: "json",
                success: function() {
                    $(this).addClass("btn btn-primary btn-sm");
                },

                error: function(response) {
                    alert(response.d);
                }
            });
        });
    })

请帮助我。非常感谢。

Answer 1

成功回调中的this不是你期望的this，为了让这个参数与点击的按钮一致，需要传入context: this > 作为 .ajax 函数的附加参数。

您可以通过 jQuery.ajax 找到更多信息:

context

• Type: PlainObject
• This object will be the context of all Ajax-related callbacks. By default, the context is an object that represents the Ajax settings
  used in the call ($.ajaxSettings merged with the settings passed to
  $.ajax).

$(document).ready(function() {
        $('.btn.btn-outline.btn-sm').click(function() {
            var pollQId = $(this).val();
            $.ajax({
                type: "POST",
                url: "Default.aspx/LikePoll",
                data: JSON.stringify({ 'pollQId': pollQId }),
                contentType: "application/json; charset=utf-8",
                datatype: "json",

                // Add this param, so the `this` in the success callback
                // will be the clicked button.
                context: this,

                success: function() {
                    $(this).addClass("btn btn-primary btn-sm");
                },

                error: function(response) {
                    alert(response.d);
                }
            });
        });
    })