Question

所以我遇到了一些JSON代码的问题。我在这里尝试随机附加一个位于extern JSON文件中的<p>个字符串。我成功地在codepen上运行它：http://codepen.io/ChucKN0risK/pen/LcFop

问题是我没有成功使我的代码在外部JSON文件上运行。当我刚开始学习JSON时，我甚至不确定我需要一张桌子或只有3个具有各自价值的标题。

搜索后我发现要使其工作，我必须将我的代码放在Jquery中的每个事件中。

$.each(data, function(i, item) {
    alert(data[i].PageName);
});

然而，无论我把代码放在哪里，它似乎都没有计数，因为我的console.log测试不起作用。

这是我的javascript代码：

// Sentences

var p = $('#sentences-wrapper');

$.getJSON('src/js/data.json', function(data) {
    var random = data.sentences[Math.floor(Math.random() * data.sentences.length)];
    p.append("<span>" + random.title + "</span>");
});

这是我的JSON代码：

{
    "sentences": [{
        "title": "la big data"
    }, {
        "title": "développer des applications ergonomiques, simples et sur mesure"
    }, {
        "title": "chorégraphier des services et orchestrer de la donnée"
    }]
};

提前感谢您的帮助：）

Answer 1

var p = $('#sentences-wrapper');

$.getJSON('src/js/data.json', function(data) {
    var random = data.sentences[Math.floor(Math.random() * data.sentences.length)];
    p.append("<span>" + random.title + "</span>");
});

getJSON回调中的data参数应该是JSON文件的内容，已经解析为JS对象。在这种情况下，您的代码集示例中的data.sentences应与jsonContent.sentences相同。

Answer 2

在您的codepen中，json位于＆＃39; jsonContent＆＃39;中，其中包含＆＃39;句子＆＃39;哪个有头衔。

在你的getJSON语句中，data.json文件的内容会对var＆＃39;数据＆＃39;

有所帮助。

所以你的标题存在于data.sentences.title中，正确的代码应该是：

$.each(data, function(index, value){
    var random = data.sentences[Math.floor(Math.random() * data.sentences.length)];
    console.log(random.title); // <= should work now
    p.append("<span>" + random.title + "</span>");
});

我不确定你为什么要添加$ .each函数。您的原始codepen示例从json打印1个随机句子。使用$ .each语句，在json中为每个元素（ea句子）附加一个随机句子。这应该导致双打和其他一些不打印。（编辑：这不是真的，因为你的json只包含一个itmes（句子）列表。当然你没有使用值或索引。在这种情况下：data.sentences，value，data [index]都将是相同的标题列表。）

如果要以随机顺序打印所有句子，则必须重新考虑一下代码。

Answer 3

查看控制台后，我发现我的JSON文件格式不正确。我不得不删除＆＃34;;＆＃34;在我的代码的末尾。 http://jsonformatter.curiousconcept.com/。无论如何，谢谢你们的帮助：）

问题将JSON代码传输到外部文件

3 个答案: