Question

我正在尝试使一些jQuery函数更容易实现，因此我尝试将一些自动完成逻辑封装到一个函数中，以允许用户发送URL的变量，Web服务的参数和控制我们需要采取的价值。使用以下脚本，我收到错误：response is not defined。我们的想法是，在这个Web服务中，会有许多不同的方法具有自动完成功能，我可以简单地将适当方法及其参数的名称传递给Complete方法，并在多个文本框中具有该功能。登记/> 为什么呢

 $(document).ready(function ()
        {

            $('#auto').autocomplete(
            {

                source: function (request, response)
                {
                    Complete('GetNames', 'hospitalName', '#auto');
                }
            });
            function Complete(url, varName, target)
            {
                $.ajax(
                    {

                        type: "POST",
                        url: "Service.asmx/" + url,
                        data: "{'" + varName + "':'" + $(target).val() + "'}",
                        dataType: "json",
                        contentType: "application/json",
                        success: function (data)
                        {
                            //uncaught reference error response is not defined
                            response(data.d);
                        },
                        error: function (xhr)
                        {
                            console.log(xhr.status);
                        }
                    });
            }

        });

在我尝试取出AJAX调用并使其成为自己的方法之前，这工作正常。我想知道

源函数调用Complete函数，源函数有request和response作为参数，为什么我的脚本中未定义它们？
我该如何解决这个问题并避免将来出现＃1的问题。

Answer 1

之前它正在运行，因为变量response在ajax成功回调方法的闭包范围内可用。由于您现在创建了一个单独的方法，因此ajax回调不在源方法的闭包范围内，因此您需要将request和response参数作为参数传递给Complete方法

$(document).ready(function () {

    $('#auto').autocomplete({
        source: function (request, response) {
            Complete(request, response, 'GetNames', 'hospitalName', '#auto');
        }
    });

    function Complete(request, response, url, varName, target) {
        $.ajax({

            type: "POST",
            url: "Service.asmx/" + url,
            data: "{'" + varName + "':'" + $(target).val() + "'}",
            dataType: "json",
            contentType: "application/json",
            success: function (data) {
                //uncaught reference error response is not defined
                response(data.d);
            },
            error: function (xhr) {
                console.log(xhr.status);
            }
        });
    }

});

Answer 2

您可以将值传递给Complete，就像在Arun P Johny的回答中一样。您还可以在Complete函数中使source:成为闭包：

$(document).ready(function () {
    $('#auto').autocomplete({
        source: function (request, response) {
            Complete('GetNames', 'hospitalName', '#auto');
            function Complete(url, varName, target) {
                var data = [];
                data[varname] = $(target).val();
                $.ajax({

                    type: "POST",
                    url: "Service.asmx/" + url,
                    data: JSON.stringify(data),
                    dataType: "json",
                    contentType: "application/json",
                    success: function (data) {
                        response(data.d);
                    },
                    error: function (xhr) {
                        console.log(xhr.status);
                    }
                });
            }
        }
    });
});

由于它嵌套在该函数中，因此可以访问其局部变量。

但是，如果您首先将AJAX代码拉出source:选项的原因是因为您希望能够从其他位置调用它（因此您可以传递不同的URL，目标或变量）名称），这不起作用 - 只能从该函数中访问该函数。

P.S。不要试图以这种方式构建自己的JSON，在我展示时使用JSON.stringify()。

JavaScript中函数参数的范围

2 个答案: