JSONファイルからJQueryでリストを作成しようとしています。デバッグするには？

Question

私はクイズの質問を得るために必要なJSONファイルを持っています。今のところ、質問をオブジェクトとして配列に格納するだけです。各質問オブジェクトには、「テキスト」（質問自体）、「選択肢」（可能な回答の配列）、「回答」（正解選択肢の場所に対応するint）があります。

質問オブジェクトを正しく保存していることを確認するにはどうすればよいですか？私は質問のリストを作成したいのですが、私はリストに質問[i] .textを入力しようとしましたが動作しませんでした。私はFirebugをインストールして何が起こっているのかをデバッグしましたが、私はそれを最大限に活用する方法は完全にはわかりません。

JSONはこの形式になります。

{ 
"text": "What does the author least like about Eclipse?", 
"choices": [ 
    "The plugin architecture.", 
    "FindBugs.", 
    "Refactoring.", 
    "The Run As menu."], 
"answer": 3 
} 

私のJavaScriptファイル：

$(document).ready(function(){ 

var questions=[]; 
$.getJSON('quiz.js',function(data){ 

    var i=0; 
    for(i=0;i<data.length;i++){ 
     questions[i]=[String(data[i].text),String(data[i].choices),int(data[i].answer)]; 

    } 

    var list = $('#list') 
    $(questions).each(function(_, text) { 
    var item = $('<li/>') 
    var link = $('<a/>').html(text) 
    link.click(function() { alert(text) }) 
    item.append(link) 
    list.append(item) 
    }) 

    $('#list').listview('refresh') 


}); 
}) 

最後に、いくつかのHTML：

<div data-role="content"> 
    <ul id="list" data-role="listview"> 
    </ul> 
</div> 

長い質問ですが、本当に助かりました。最終目標は、クリックすると回答の選択肢を表示し、選択されたオプションが正しいかどうかをユーザーに通知するためのトーストを提供する質問のリストを持つことです。また、正しく答えられた場合はGreenの質問をハイライトし、それ以外の場合はRedを強調したいと思います。

EDIT：

の作業コード：

$(document).ready(function(){ 

$.getJSON('quiz.js',function(data){ 

var questions = data; 
var list = $('#list') 

$(questions).each(function(index, object) { 

$.each(object, function(key, value){ 

    if(key === 'text'){ 
     //do something with qustion 

      var item = $('<li/>') 
      var link = $('<a/>').html(value) 
      link.click(function() { alert(value) }) 
      item.append(link) 
      list.append(item) 
      $('#list').listview('refresh') 
     } 

     }); 
    }); 

    }); 
}); 

Answer 1

使用すると、1つの間違ったeachを使用している：

後は、あなたが欲しいものを行うには良い方法です。第2に、JSONレスポンスにObject of Objectを戻していることに気が付かなければなりません。あなたの質問/回答データを含む各オブジェクトを繰り返し処理し、さらにその質問/回答オブジェクトを繰り返し処理する必要があります。さらに、ネストされたオブジェクトにネストされた配列を持ち、それをループして質問を得る必要があります。いくつかの擬似コードを見てみましょう：

//will give you each object your data 
$.each(data, function(key, object){ 

    //do something with my [Object, Object] 
    $.each(object, function(key, value){ 

     if(key === 'text'){ 
      //do something with qustion 
     } 

     if(key === 'choices'){ 
      //loop over array 
     } 
    } 
} 

Answer 2

はしてみてください。この..

var ques=[]; 
$.getJSON('quiz.js',function(data){ 
for(var i in data) 
{ 
var text =data[i].text; 
var choic=data[i].choices; 
var output='<li>'+text+'</li>'; 
} 
$('#list').empty().append(output); 
}); 

Answer 3

あなたが実際にあなたがそれを取得する際の選択肢の配列を反復処理していますか？あなたのいずれかが、私の知る限り理解できるようにjQueryで見つかった$.eachか、純粋なJavaScriptをしたい場合は

for (property in object) { 
    if (object.hasOwnProperty(property)) { 
    // do stuff 
    } 
} 

Answer 4

を使用する必要がhere's a fiddle

： questionsは、いくつかの要素の配列です。これらの要素は、3つの要素（テキスト、選択肢、および回答）の配列になります。

eachステートメントのjqueryセレクターで質問配列を使用しています。

$.each(questions, function (i, value) { 
    var text = questions[i][0]; 
    var choice = questions[i][1]; 
    var answer = questions[i][2]; 
    var output='<li>'+text+'</li>'; 
    // rest of your code using text, choices and answers 
});