价值不会推向数组

时间:2013-03-17 16:33:10

标签: javascript jquery

在下面的代码中,我使用此var tag = data[j]['text'];为JSON中的变量赋值,然后使用此console.log(tag);(用于测试)输出它。

我尝试使用tags.push(tag);将值推送到数组中,但它不起作用!

为什么这些值不会进入数组?我只是想将tag的内容放到数组中......

function GetAvailableTags() {
            var url = '/TextCodes/TextCodes?key=';
            var tagGroups = [];
            $('.ui-autocomplete-input').each(function () {
                var key = $(this).attr('id');
                var tags = [];
                //console.log(key);
                $.getJSON(url + key, function (data) {
                    for (var j = 0, len = data.length; j < len; j++) {
                        var tag = data[j]['text'];
                        console.log(tag);
                        tags.push(tag);
                    }
                });
                console.log(tags.length);
                for (var k = 0, len = tags.length; k < len; k++) {
                    console.log(tags[k]);
                }
            });
        }

感谢您的帮助。

2 个答案:

答案 0 :(得分:2)

因为$.getJSON是异步函数。这意味着你的代码

console.log(tags.length);
for (var k = 0, len = tags.length; k < len; k++) {
    console.log(tags[k]);
}

将在$.getJSON回调函数之前执行:

function () {
    var key = $(this).attr('id');
    var tags = [];
    //console.log(key);
    $.getJSON(url + key, function (data) {
        for (var j = 0, len = data.length; j < len; j++) {
            var tag = data[j]['text'];
            console.log(tag);
            tags.push(tag);
        }
    }

这是为什么在查看上面的代码时你的变量似乎是空的,但是如何在回调函数中用console.log(tag);打印数据。

<强>更新

以下是使用$ .ajax方法而不是$ .getJSON指定必须使用参数asynch : false

同步检索数据的示例

通过这种方式,服务器调用响应(成功回调)是必需的,以继续该过程。这种非标准方式的缺点是您的网页可能会被冻结,等待服务器响应。这不是最好的方式,但有时它很有用。

function GetAvailableTags() {
    var url = '/TextCodes/TextCodes?key=';
    var tagGroups = [];
    $('.ui-autocomplete-input').each(function () {
        var key = $(this).attr('id');
        var tags = [];
        //console.log(key);
        $.ajax({
            url: url + key,
            type: 'POST',
            asynch: false,//specify to stop JS execution waiting the server response
            success: function (data) {
                for (var j = 0, len = data.length; j < len; j++) {
                    var tag = data[j]['text'];
                    console.log(tag);
                    tags.push(tag);
                }
            },
            error : function(jqXHR, textStatus, errorThrown) {
                alert('an error occurred!');
            }
        });
        console.log(tags.length);
        for (var k = 0, len = tags.length; k < len; k++) {
            console.log(tags[k]);
        }
    });
}

答案 1 :(得分:0)

我的解决方案有点长而愚蠢,但它确实有效。现在,我可以像数组textCodes['taxes']一样访问变量。 sdespont的async笔记也有帮助。

    var textCodes = GenerateTextCodes();
    console.log(textCodes);

    function GenerateTextCodes() {
        var arr = [];
        $('.ui-autocomplete-input').each(function () {
            var id = $(this).attr('id');
            arr[id] = GetAvailableTags(id);
        });
        //console.log(arr['taxes']);
        return arr;
    }

    // get all autocomplete element IDs and put them into an array
    function GetAvailableTags(key) {
        var url = '/TextCodes/TextCodes?key=';
        var tags = [];
        $.ajax({
            url: url + key,
            type: 'GET',
            async: false,
            success: function (data) {
                //console.log(data[0].text);
                //console.log(data.length);
                for (var i = 0; i < data.length; i++) {
                    //console.log(data[i].text);
                    tags.push(data[i].text);
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                alert('an error occurred!');
            }
        });
        //console.log(tags);
        return tags;
    }