Question

我想请求一些帮助。我有一个外部JSON文件，里面有一个数组，如下所示：

{ "Files": [
    {
        "fileName": "Trains",
        "fileID": "t1"
    },
    {
        "fileName": "Planes",
        "fileID": "p1"
    },
    {
        "fileName": "Cars",
        "fileID": "c1"
    }
]}

我正在尝试最终使用这些数据填充XHTML页面中的下拉选择菜单，同时使用JavaScript编写它。到目前为止，我已经得到了以下内容，但现在无法弄清楚我在最后的障碍中出错了。关于我不理解的任何指示，谢谢。

function fileDropdown() {
    var options = "";
    $.getJSON(
        "json/files.json", 
        function(result) {
            //find the array and do seomthing
            $.each(result.Files, function(key, val) {
                options += '<option value="' + val.fileID + '">' + val.fileName + '</option>';
            });
        }
    );
    document.write("<select>"+options+"</select>");
}

Answer 1

试试这个：

function fileDropdown()
{

$.getJSON("json/files.json", function(result) {
//find the array and do seomthing
    var options = "";
    $.each(result.Files, function(key, val) {
        options += '<option value="' + val.fileID + '">' + val.fileName + '</option>';
    });
    var select = $('<select/>');
    select.append(options);
    $(document.body).append(select);
});
}

Answer 2

谢谢，现在解决了这个问题。会投票给你，但需要更多的声誉。

我用过

$.each(result.Files, function(file) {
        selectElement.append($('<option value="' + this.fileID + '">' + this.fileName + '</option>'));

Answer 3

$.getJSON("json/files.json", ...)表示“接听window.location，追加json/files.json，然后使用此网址发送GET请求”。

要解决此问题，您可以使用绝对file:网址。但出于安全原因，您的浏览器可能会拒绝加载该文件。

另一种方法是让您的Web服务器在请求上述URL时将文件发送到浏览器。

在JavaScript中读取外部JSON文件以填充选择下拉列表

3 个答案: