使用JavaScript/jQuery在本地获取JSON

我在这里读了几个问题，指出由于安全策略等原因，JSON文件无法在Google Chrome中本地加载。因此我在上找到了解决方案

我的javascript现在如下所示：

jQuery(document).ready(function($){
    var items = [];
    var settingsFile = "corr/settings.json";
    var sidePanel = $(document.createElement('div')).addClass('corrPanel').appendTo('body');
    /**
     * Gets JSON file
     * @param  string  jsonFile
     * @return json    file contents
     */
    function getSettings(jsonFile) {
        request = new XMLHttpRequest();
        request.open('GET', jsonFile, true);
        request.onload = function() {
            if (request.status >= 200 && request.status < 400) {
                jsonRows = JSON.parse(request.responseText);
                console.log(jsonRows);
                $.each(jsonRows, function(key, row) {
                    items.push("<input type='text' class='iris' id='" + row.section + "'>");
                });
                console.log(items);
            } else {
                console.log("Error getting JSON file");
            }
        };
        request.send();
    }

    getSettings(settingsFile);
    console.log(items);
});

jQuery（文档）.ready（函数（$）{
var项目=[]；
var settingsFile=“corr/settings.json”；
var sidePanel=$（document.createElement（'div'））.addClass（'corrPanel'）.appendTo（'body'）；
/**
*获取JSON文件
*@param-string-jsonFile
*@return json文件内容
*/
函数getSettings（jsonFile）{
请求=新的XMLHttpRequest（）；
open（'GET'，jsonFile，true）；
request.onload=函数（）{
如果（request.status>=200&&request.status<400）{
jsonRows=JSON.parse（request.responseText）；
log（jsonRows）；
$.each（jsonRows，function）（键，行）{
项目。推送（“”）；
});
控制台日志（项目）；
}否则{
log（“获取JSON文件时出错”）；
}
};
request.send（）；
}
getSettings（设置文件）；
控制台日志（项目）；
});

Console.log返回JSON文件的输出，没有任何问题

因此，一切都很好，但由于我不熟悉JavaScript（并且不知道如何处理那里的函数和属性），因此未设置（并返回）数据属性，因此结果属性也未定义

您能告诉我如何将请求结果传递到函数之外吗

谢谢

---

编辑：我将推送结果添加到items数组，它在getSettings函数的本地上下文中可用，但最后一个console.log没有输出。

整个问题是我试图直接访问items属性。但是请求设置在页面加载后被调用。所以我把逻辑转移到成功部分

if (request.status >= 200 && request.status < 400) {
    // execute success code and manage items here ...
}

if（request.status>=200&&request.status<400）{
//在此处执行成功代码并管理项目。。。
}

所以我找到了解决方案

-不，你没有。。。chrome不会读取文件：///uri，除非您使用特定的命令行选项启动它。。。然后，即使是jquery也可以工作，因为jquery只是包装了xmlhttprequest——不管您使用什么库，都不能从异步请求返回响应。使用

callbacks

或执行

success

callback中的操作。请参阅：@RayonDabre在我的情况下，什么是回调？既然json是对象数组，我可以迭代它们还是。。。你能给我举个例子吗？基本上你不需要回调。在成功过程中，做任何你需要的事情。可能在

JSON.parse

语句之后。我喜欢使用jQuery执行普通javascript代码。