Question

如何在$.ajax(){success}方法中调用pagePresets.setFilter（）？

self.setFilter.call('network', data.networks);返回

未捕获的TypeError：无法读取属性＆＃39; call＆＃39;未定义的（...）

self.setFilter('network', data.networks);

时

未捕获的TypeError：self.setFilter不是函数（...）

代码：

function pagePresets() {
    this.loading = true;
    this.isLoading = function () {
        return this.loading;
    };
    this.setLoading = function (state) {
        this.loading = state;
        return;
    };
    /** this function loads saved filters */
    this._loadFilters = function() {
        jQuery.ajax({
            type: 'post',
            dataType: "json",
            url: 'data.json',
            success: function (data) {
                //HOW TO CALL setFilter? this solution is not working
                pagePresets.prototype.setFilter.call('network', data.networks);
            }
        });
    };
}

pagePresets.prototype.setFilter = function (target, value) {
 console.info(target + ' ' + value );
}

Answer 1

call函数将第一个参数作为“上下文对象”。深入了解调用函数here。

在ajax回调函数this或self中不再引用您的类对象。 pagePresets是一个没有静态属性的函数类。所以你需要得到对象实例。

您需要指定要使用的原型函数调用哪个实例。我通常在我的“类”中声明一个私有属性，它包含对上下文改变的场景的对象的引用。

function pagePresets() {
    //create a local variable here
    var localInstance = this;

    this.loading = true;
    this.isLoading = function () {
        return this.loading;
    };
    this.setLoading = function (state) {
        this.loading = state;
        return;
    };
    /** this function loads saved filters */
    this._loadFilters = function() {
        jQuery.ajax({
            type: 'post',
            dataType: "json",
            url: 'data.json',
            success: function (data) {
                //Use the variable here to specify the correct context.
                //the functions arguments need to be an array for the call function
                pagePresets.setFilter.call(localInstance, [ 'network', data.networks ]);
            }
        });
    };
}

pagePresets.prototype.setFilter = function (target, value) {
    console.info(target + ' ' + value );
}

Answer 2

您可以尝试在另一个函数中调用它，如

function success() {
    pagePresets.prototype.setFilter.call('network', data.networks);
}

function error() {
    alert("error");
}


function searchEntity(id,userName, family) {
    $.ajax({
        type : "POST",
        contentType : "application/json",
        url : "http://localhost:8080/mvc-test/rest/user/searchAll?pageNumber=1&pageSize=2&&orderBy=userName asc",
        headers: {'X-CSRF-TOKEN': getMetaContentByName('_csrf')},
        data : JSON.stringify({
            "id":id,
            "userName" : userName,
            "familyName" : family
        }),
        dataType : 'json',
        success : success,
        error : error
    });
}

Answer 3

另一种方法是将父上下文传递给成功方法或委托。

在下面的代码中，通过引用父（类）上下文onAjaxResponseReceived来调用self函数，从中可以访问其他方法func1和func2

class TestClass{
    constructor(searchUrl) {
        this.searchUrl = searchUrl;
    }

    bind() {
        self = this;

        $.ajax({
            url: self.searchUrl,
            type:"POST",
            data: data,
            success: function (responseData) {
                self.onAjaxResponseReceived(self, responseData);
            }
       });
    }

    onAjaxResponseReceived(self, data) {
        self.func1(data);
        self.func2(data);
    }

    func1(data) {
        console.log('func 1');
    }

    func2(data) {
        console.log('func 2');
    }

}

如何在ajax成功函数内调用函数方法？

3 个答案: