将 JSON 文件加载到 JavaScript 变量中答案

【问题标题】：Load JSON file into JavaScript variable将 JSON 文件加载到 JavaScript 变量中
【发布时间】：2015-12-26 03:24:17
【问题描述】：

所以，我需要将以下代码放入 JSON 文件中，并将其加载到单独的 JavaScript 文件中：

var allQuestions = [{
  question: "What is Elvis Presley's middle name?",
  choices: ["David", "Aaron", "Eric", "Jack"],
  correctAnswer: 1
}, {
  question: "Who is the singer of the Counting Crows?",
  choices: ["Adam Duritz", "John Adams", "Eric Johnson", "Jack Black"],
  correctAnswer: 0
}, {
  question: "Who is the Queen of Soul?",
  choices: ["Mariah Carey", "Whitney Houston", "Aretha Franklin", "Beyonce"],
  correctAnswer: 2
}, {
  question: "Which famous group was once known as The Quarrymen?",
  choices: ["The Beatles", "The Birds", "The Who", "Led Zeppelin"],
  correctAnswer: 0
}];

换句话说，allQuestions 的内容需要放在一个 JSON 文件中，然后加载到一个单独的 JavaScript 文件中的 allQuestions 变量中。 JSON 文件会是什么样子？如何将其加载到 allQuestions 变量中？

【问题讨论】：

标签： javascript jquery json

【解决方案1】：

尝试使用JSON.stringify()，$.getJSON()

JSON 文件是什么样子的

"[
  {
    "question": "What is Elvis Presley's middle name?",
    "choices": [
      "David",
      "Aaron",
      "Eric",
      "Jack"
    ],
    "correctAnswer": 1
  },
  {
    "question": "Who is the singer of the Counting Crows?",
    "choices": [
      "Adam Duritz",
      "John Adams",
      "Eric Johnson",
      "Jack Black"
    ],
    "correctAnswer": 0
  },
  {
    "question": "Who is the Queen of Soul?",
    "choices": [
      "Mariah Carey",
      "Whitney Houston",
      "Aretha Franklin",
      "Beyonce"
    ],
    "correctAnswer": 2
  },
  {
    "question": "Which famous group was once known as The Quarrymen?",
    "choices": [
      "The Beatles",
      "The Birds",
      "The Who",
      "Led Zeppelin"
    ],
    "correctAnswer": 0
  }
]"

如何将其加载到 allQuestions 变量中？

$.getJSON("/path/to/json", function(data) {
  var allQuestions = data;
})

jsfiddle https://jsfiddle.net/dydhgh65/1

【讨论】：

由于某种原因仍未加载。也许我做错了什么。我应该在 JSON 文件中包含引号吗？另外，我需要在你的小提琴中包含 $.post 函数吗？
@Julian "supposed to include the quotes in the JSON file" 尝试去掉第一个和最后一个双引号，检查jsonlint.com;另请参阅 http://stackoverflow.com/questions/5293555/how-do-you-represent-a-json-array-of-strings ，json.org 。 “另外，我需要在你的小提琴中包含 $.post 函数吗？” $.post() 用于 jsfiddle 回显响应，请参阅 doc.jsfiddle.net/use/echo.html

【解决方案2】：

您可以像这样使用ES6 fetch API,：

// return JSON data from any file path (asynchronous)
function getJSON(path) {
    return fetch(path).then(response => response.json());
}

// load JSON data; then proceed
getJSON('/path/to/json').then(data => {
    // assign allQuestions with data
    allQuestions = data;  
}

这里是使用async和await.的方法

async function getJSON(path, callback) {
    return callback(await fetch(path).then(r => r.json()));
}

getJSON('/path/to/json', data => allQuestions = data);

【讨论】：

【解决方案3】：

试试这个：

var myList;
$.getJSON('JsonData.json')
.done(function (data) {
myList = data;
});

【讨论】：