全局作用域、返回值和ajax的问题

标题是猜测我的脚本出了什么问题:

这是在我的global.js脚本:

alert(search.getLabelsNames(); //alerts as undefined.
$('#search').autocomplete({
    source: function( request ) {
        search.getLabelsNames();
    },
    minLength:1
});

这是在我的functions.js脚本:

var search;
window.search = {
    getLabelsNames:function( search ) {
        $.ajax({
            url : '../db_scripts/get_labels_names.php',
            type: "POST",
            data: { id: search }, //this defaults to nothing. not a problem
            success : function( data ) {
                var dataObj = jQuery.parseJSON( data );
                $.each(dataObj, function() {
                    alert(this.name);
                    return this.name;
                })
            }
        });
    }
}

在每个函数this.name中，从数据库中正确返回每个标签名称。但是当我从globals.js调用它时，它返回为undefined。如果我返回数字1,search.getLabelsNames()警报1..所以找到全局函数没有问题。

这个脚本有什么问题，为什么global.js找不到正在返回的this.name ?

你有两个问题:

不能从jQuery.each回调返回数据。返回值指示是否停止迭代。来自文档:

可以通过使回调函数返回false，在特定的迭代中中断$.each()循环。返回非false与for循环中的continue语句相同;它将立即跳转到下一次迭代。
你不能从Ajax回调返回数据。Ajax是异步的，这意味着在您的示例中，getLabelsNames在响应被检索和处理之前返回。

幸运的是，自动完成插件接受一个函数作为源。你已经在使用它了，但不正确。让它接受第二个参数，这是一个回调。来自文档:

第三种变体，回调，提供了最大的灵活性，可用于将任何数据源连接到Autocomplete。回调得到两个参数:
一个请求对象，有一个名为" ter"的属性，它指的是当前文本输入中的值。例如，当用户输入"new york "在城市字段中，自动补全词将等于"new yo"。
一个响应回调，它期望一个参数包含要建议给用户的数据。应该根据提供的术语对该数据进行过滤，并且可以采用上述简单本地数据(具有标签/值/两者属性的String-Array或Object-Array)的任何格式。在提供自定义源回调以处理请求期间的错误时，这一点非常重要。即使遇到错误，也必须始终调用响应回调。这可确保小部件始终具有正确的状态。

所以你要做的就是把这个回调传递给getLabelsNames这样它就可以在Ajax调用的success方法中被调用了

$('#search').autocomplete({
    source: function(request, callback) {
        // pass the callback along
        search.getLabelsNames(request.term, callback);
    },
    minLength:1
});
window.search = {
    getLabelsNames:function(search, callback) { // accept callback as argument
        $.ajax({
            url : '../db_scripts/get_labels_names.php',
            type: "POST",
            data: { id: search }, //this defaults to nothing. not a problem
            success : function( data ) {
                // format the data
                data = $.map(jQuery.parseJSON(data), function(obj) {
                    return obj.name;
                });
                // pass the data to the callback
                callback(data);
            }
        });
    }
}

请注意，我在这里使用jQuery.map ^[docs]，其中从回调返回值具有不同的含义。不要与jQuery.each混淆

this取决于调用的上下文。所以在你的内部函数中，this是不一样的。

根据您的dataObj的结构，您可能希望这样做:

$.each(dataObj, function(key, value) {
                alert(value.name);  // value will correspond to the current item being looped over
                return value.name;
            })

AJAX调用是异步的，这意味着您触发它们，它们稍后响应。您不能简单地从ajax调用中"返回"一个值——您需要在"成功"时将值传递给另一个函数。

相关内容

最新更新

热门标签：