jQuery ajax成功不适用于$（this）吗？

小编典典

jQuery ajax成功不适用于$（this）吗？

ajax

我一直在使用jQuery中的ajax工具，并且在成功执行ajax时使用$（this）遇到了问题。我想知道是否有可能在您的成功中使用$（this），正如我所见的教程使用它那样，但是当我尝试使用它时，它不起作用…但是，如果我使用$（document）或其他某种方法来获得它，我想要的对象工作正常…任何帮助将不胜感激，因为我对jQuery很陌生！提前致谢！我正在玩的代码如下：

$(".markRead").click(function() {
    var cId = $(this).parents("div").parents("div").find("#cId").val();
    var field = "IsRead";

    $.ajax({
        type: "POST",
        url: "ajax/contract_buttons.php",
        dataType: "text",
        data: "contractId=" + cId + "&updateField=" + field,
        async: false,
        success: function(response) {
            //$(this) doesnt recognize the calling object when in the success function...
            $(this).find("img").attr("src", "images/read.png");
        },
        error: function(xhr, ajaxOptions, thrownError) {
            alert(xhr.statusText);
            alert(thrownError);
        }
    });
});

阅读 242

2020-07-26

共1个答案

小编典典

this总是引用当前的执行上下文，因此它不必像ajax成功处理程序那样在回调函数中保持不变。如果要引用它，则必须按照Dennis所指出的那样进行操作，并将其值保存到自己的局部变量中，以便以后可以引用它，即使实际this值可能已设置为其他值。这绝对是javascript的细微差别之一。将代码更改为此：

$(".markRead").click(function() {
    var cId = $(this).parents("div").parents("div").find("#cId").val();
    var field = "IsRead";
    var element = this;   // save for later use in callback

    $.ajax({
        type: "POST",
        url: "ajax/contract_buttons.php",
        dataType: "text",
        data: "contractId=" + cId + "&updateField=" + field,
        async: false,
        success: function(response) {
            //$(this) doesnt recognize the calling object when in the success function...
            $(element).find("img").attr("src", "images/read.png");
        },
        error: function(xhr, ajaxOptions, thrownError) {
            alert(xhr.statusText);
            alert(thrownError);
        }
    });
});

2020-07-26