正确循环 ajax 返回的 json 对象

Question

我无法循环返回的 json 对象，因为它不是一个简单的数组。

{
    "ModuleSlides": [
        {
            "content": "\u003Cslide type=\u0022quiz\u0022 answer=\u0022option1\u0022 data-slide-num=\u00221\u0022\u003E\n  \u003Cdiv class=\u0022quiz-wrapper\u0022\u003E\n    \u003Cspan class=\u0022quiz-progress\u0022\u003EQUESTION 4 of 23\u003C\/span\u003E\n    \u003Cspan class=\u0022quiz-question\u0022\u003EWhat is Manual Handling for the sake of this quiz you have to take?\u003C\/span\u003E\n  \u003C\/div\u003E\n\n  \u003Cdiv class=\u0022btn-group\u0022 data-toggle=\u0022buttons\u0022\u003E\n    \u003Clabel class=\u0022btn btn-primary col-xs-12\u0022\u003E\u003Cinput type=\u0022radio\u0022 name=\u0022options\u0022 id=\u0022option1\u0022\u003EOption 1\u003C\/label\u003E\n    \u003Clabel class=\u0022btn btn-primary col-xs-12\u0022\u003E\u003Cinput type=\u0022radio\u0022 name=\u0022options\u0022 id=\u0022option2\u0022\u003EOption 2\u003C\/label\u003E\n    \u003Clabel class=\u0022btn btn-primary col-xs-12\u0022\u003E\u003Cinput type=\u0022radio\u0022 name=\u0022options\u0022 id=\u0022option3\u0022\u003EOption 3\u003C\/label\u003E\n    \u003Clabel class=\u0022btn btn-primary col-xs-12\u0022\u003E\u003Cinput type=\u0022radio\u0022 name=\u0022options\u0022 id=\u0022option3\u0022\u003EOption 4\u003C\/label\u003E\n  \u003C\/div\u003E\n\u003C\/slide\u003E"
        },
        {
            "content": "\u003Cslide type=\u0022quiz\u0022 answer=\u0022option1\u0022 data-slide-num=\u00222\u0022\u003E\n\u003Ch1\u003ECourse title\u003C\/h1\u003E\n\u003Ch2\u003EQuiz question: Choose an answer (1)\u003C\/h2\u003E\n\u003Cdiv class=\u0022btn-group\u0022 data-toggle=\u0022buttons\u0022\u003E\n\u003Clabel class=\u0022btn btn-primary col-xs-12\u0022\u003E\u003Cinput type=\u0022radio\u0022 name=\u0022options\u0022 id=\u0022option1\u0022\u003EOption 1\u003C\/label\u003E\n\u003Clabel class=\u0022btn btn-primary col-xs-12\u0022\u003E\u003Cinput type=\u0022radio\u0022 name=\u0022options\u0022 id=\u0022option2\u0022\u003EOption 2\u003C\/label\u003E\n\u003Clabel class=\u0022btn btn-primary col-xs-12\u0022\u003E\u003Cinput type=\u0022radio\u0022 name=\u0022options\u0022 id=\u0022option3\u0022\u003EOption 3\u003C\/label\u003E\n\u003Clabel class=\u0022btn btn-primary col-xs-12\u0022\u003E\u003Cinput type=\u0022radio\u0022 name=\u0022options\u0022 id=\u0022option3\u0022\u003EOption 4\u003C\/label\u003E\n\u003C\/div\u003E\n\u003C\/slide\u003E"
        }
    ],
    "quizResults": "{\u00221\u0022:\u0022option1\u0022}"
}

我尝试了 returnedSlides.ModuleSlides[i].content 的不同组合，但我似乎无法正确组合。

for (var i = 0; i < returnedSlides.length; i++) {                  
    $("slides").append(returnedSlides.ModuleSlides[i].content);
};

Answer 1

returnedSlides没有长度，是一个Object，你要returnedSlides.ModuleSlides.length.

Answer 2

在 ModuleSlides 上循环的正确代码

for (var i = 0; i < returnedSlides.ModuleSlides.length; i++) {                  
    $("slides").append(returnedSlides.ModuleSlides[i].content);
};

或者，您可以对数组元素执行 forEach() 循环，即

returnedSlides.ModuleSlides.forEach(function(element) {
    $("slides").append(element.content);
})

正确循环 ajax 返回的 json 对象

correctly loop a ajax returned json object

javascript

json

javascript-objects