如何在$ .ajax的成功回调中传递$(this)

Question

我已经看到一些不同的访问$(这个)的例子是ajax的成功回调但没有给我我想要的答案 - 他们都在ajax函数中访问$(this),我想将$(this)传递给a单独的功能.

因此,如果有2个文本框需要验证

$("#tb1").focusout(function(){
    $.ajax({
        type:'POST',
        url: 'validURL',
        data: {various_parameters},
        contentType: 'application/json; charset=utf-8',
        dataType:'json',
        success: function(data){
            validInput(data, $(this));
        },
        error: error
    });
}

$("#tb2").focusout(function(){
    $.ajax({
        type:'POST',
        url: 'validURL',
        data: {various_parameters},
        contentType: 'application/json; charset=utf-8',
        dataType:'json',
        success: function(data){
            validInput(data, $(this));
        },
        error: error
    });
}

function validInput(response, obj){
    console.log(response.d);
    console.log(obj.val());
};

当我运行代码时,我得到了响应的正确值.但是一个错误:jquery-1.11.1.min.js:4未捕获的TypeError:无法读取obj.val()的undefined属性'toLowerCase'.

难道我做错了什么？

谢谢你的帮助.请参阅:DOS /运行

Answer 1

$(this)相对于最内层函数,在这种情况下,您需要$(this)在ajax查询之前分配给变量,并在成功中使用该变量.

$("#tb1").focusout(function(){
    var elem = $(this);
    $.ajax({
        type:'POST',
        url: 'validURL',
        data: {various_parameters},
        contentType: 'application/json; charset=utf-8',
        dataType:'json',
        success: function(data){
            validInput(data, elem);
        },
        error: error
    });
}

Answer 2

那是因为聚焦元素的上下文在ajax调用中丢失了.

您可以context在ajax中设置选项以引用DOM对象,以便将ajax中的上下文设置为元素上下文:

$("#tb2").focusout(function(){
  $.ajax({
    type:'POST',
    url: 'validURL',
    context : this,
    data: {various_parameters},
    contentType: 'application/json; charset=utf-8',
    dataType:'json',
    success: function(data){
        validInput(data, $(this));
    },
    error: error
  });
});