web-dev-qa-db-ja.com

JQuery $ .each（）JSON配列オブジェクトの反復

JQueryの$ .each（）反復を解決しようとすると、実際に困難が生じます。

これは私の配列で、便宜上結果を制限しています

[{"GROUP_ID":"143",
  "GROUP_TYPE":"2011 Season",
  "EVENTS":[
    {"EVENT_ID":"374","SHORT_DESC":"Wake Forest"},
    {"EVENT_ID":"376","SHORT_DESC":"Yale"},
    {"EVENT_ID":"377","SHORT_DESC":"Michigan State"}]
 },
 {"GROUP_ID":"142",
  "GROUP_TYPE":"2010 Season",
  "EVENTS":[
    {"EVENT_ID":"370","SHORT_DESC":"Duke"},
    {"EVENT_ID":"371","SHORT_DESC":"Northwestern"},
    {"EVENT_ID":"372","SHORT_DESC":"Brown"}]
}]

私の最初の$ .eachイテレーションは非常にうまく機能しますが、「EVENTS」のサブイテレーションは私が問題を抱えている場所です

私の最初の$ .each（）関数

     $.each(json, function(key) {

            html = '<a href="'+json[key].GROUP_ID+'">';

     ....

動作しない2番目の$ .each（）関数

     $.each(json.EVENTS, function(key) {
    newHTML += '<p>'+json.EVENTS[key].SHORT_DESC+'</p>';


     ...

私はこれが単一のJSONオブジェクトではなく、オブジェクトのJSON配列であることを（大雑把に）理解していますが、最初のバージョンが機能するのか、2番目のバージョンが機能しないのか理解していない

これが$ .each（）内の$ .each（）であることがわかったら、私が達成したい最終結果は、以下のコードが機能せず、おそらくばかげていることを知っていますが、達成：親を介して反復し、次に親を介して反復する

$.each(json, function(key) {

            html = '<a href="'+json[key].GROUP_ID+'">';

     $.each(json[key].EVENTS, function(subkey) {

            html = '<a href="'+json[key]EVENTS[subkey].SHORT_DESC+'">';
 ...
jqueryjsoneach
18
Jay Rizzi

$.each function()にも2番目の変数を割り当てます。これにより、データが提供されるため、はるかに簡単になります（したがって、インデックスを操作する必要はありません）。

$.each(json, function(arrayID,group) {
            console.log('<a href="'+group.GROUP_ID+'">');
    $.each(group.EVENTS, function(eventID,eventData) {
            console.log('<p>'+eventData.SHORT_DESC+'</p>');
     });
});

質問で試していたすべてを印刷する必要があります。

http://jsfiddle.net/niklasvh/hZsQS/

edit変数の名前を変更し、内容を理解しやすくしました。

39
Niklas