JSON配列名を使用して動的に入力するドロップダウンメニュー

Question

オブジェクトカテゴリ名をドロップダウンメニューに入力したいとします。音はシンプルですが、私はこれを理解できません。助けてください。例えば

：

JSON

window.cars = 
{ 

"compact": 

[ 
{ "title": "honda", 
     "type": "accord", 
     "thumbnail": "accord_t.jpg", 
     "image": "accord_large.jpg" }, 
{ "title": "volkswagon", 
     "type": "rabbit", 
     "thumbnail": "rabbit_t.jpg", 
     "image": "volkswagon_large.jpg" } 
], 

"trucks": 

[ 
{ "title": "Ford", 
    "type": "f-150", 
    "thumbnail": "ford_t.jpg", 
    "image": "chevy_large.jpg" }, 
{ "title": "GMC", 
     "type": "silverado", 
     "thumbnail": "gmc_t.jpg", 
     "image": "gmc_large.jpg" } 
] 
}; 

だから、 "コンパクト" と "トラック" ドロップダウンメニューを移入します。

HTML + jQueryの

$.each(cars, function(k, v){ 

$('select').append('<option value="' + k + '">' + k + '</option>'); 

}); 

} 

任意のアイデアは、なぜこれが動作しないのだろうか？

ありがとうございます！

Answer 1

JSONには2種類のオブジェクトが必要です。あなたはそうすることによって、要素を取り込むことができます。

$(function(){ 
    window.cars = {...}; // JSON 

    $.each(cars['compact'], function(k, v){ 
     $('select').append('<option value="' + k + '">' + v.title + '</option>'); 
    });  
}); 

をそれとも、両方のオブジェクトを使用する必要がある場合、あなたはすべてのオブジェクトは、アレイ内の同様の特性が含まれていることを仮定して（各1をループしてい

$(function(){ 
    window.cars = {...}; // JSON 

    var index = 0; 
    $.each(cars, function(k, v){ 
     $.each(v, function(i, obj){ 
      $('select').append('<option value="' + index + '">' + obj.title + '</option>'); 
      index++; 
     }); 
    });  
});