Question

我有以下代码，它包含在keypress函数中：

$.getJSON('dimensions.json', function(data) {
    $.each(data, function(index) {
        $('#div1').append(index);
    });
});

我正在尝试首先获取JSON字符串，将其保存在变量中，然后运行each()。我想基本上将each()分开以取消与getJSON()函数的链接，因为我不希望它为每个按键提取json文件。

我试过这个，但它不起作用：

var JSONstr = $.getJSON('dimensions.json');
$.each(JSONstr, function(index) {
    $('#div1').append(index);
});

Answer 1

在第一个示例中，您在回调中执行$ .each。收到结果后，回调由其他一些回调执行，而$ .getJSON立即返回而不等待结果（因为JavaScript中没有阻塞设计）

因此，第二个示例中的代码永远不会起作用：$ .each在从Web服务器收到任何结果之前开始，甚至可能在发送请求之前。无论$ .getJSON的返回值是什么，它的都不能，因为JavaScript的设计是AJAX请求的结果。

UPD：看到你的评论，现在我明白你想做什么。以下是如何执行此操作的简单示例：

function ActualHandler(data) {
    $.each(data, function(index) {
        $('#div1').append(index);
    });
}

function KeypressHandler() {
    if (window.my_data) { // If we have the data saved, work with it
        ActualHandler(window.my_data);
    }
    else { // Otherwise, send the request, wait for the answer, then do something
        $.getJSON('dimensions.json', function(data) {
             window.my_data = data; // Save the data
             ActualHandler(data); // And *then* work on it
        });
    }
}

此处，在收到数据之前未启动ActualHandler，一旦发生这种情况，将立即处理所有后续点击。

这种特殊情况的缺点是，如果用户在第一个请求运行时再次单击，则会再发送一个请求。但要解决这个问题，你需要维护一些队列，这有点超出范围。

Answer 2

你陷入了异步陷阱。您的$.each()函数不会等待$.getJSON()调用来获取数据。你可以使用好的'ol $.ajax()函数解决这个问题。像这样：

function processJSON(data) {
    $.each(data, function(index) {
        $('#div1').append(index);
    });
}

$.ajax({
    url: 'dimensions.json',
    dataType: 'json',
    async: false,
    success: processJSON(data)
});

getJSON to string然后循环遍历字符串

2 个答案: