-3
var g_Vehicle = {
        g_Vehicle1: [
            Year: "2011",
            Make: "abc",
            Model: "Avenger",
            SubModel: "def"
        ],
        g_Vehicle2: [
            Year: "2012",
            Make: "abc",
            Model: "200",
            SubModel: "deft"
        ],
        g_Vehicle3: [
            Year: "2011",
            Make: "dfg",
            Model: "300",
            SubModel: "sde"
        ],
}
4

4 に答える 4

2

これはJSONではなく、JavaScriptオブジェクトリテラルです。無効なもの、構文が正しくありません...

var g_Vehicle = {
        g_Vehicle1: [
        //  v------------------------here
            Year: "2011",
            Make: "abc",
            Model: "Avenger",
            SubModel: "def"
        ],
        ...

[...]は配列を定義する方法ですが、配列の中に入れるのはオブジェクトのプロパティを定義する方法です。以上をとに変更する[と有効になりますが、使いにくいです。代わりに、全体をオブジェクトの配列にするだけです。]{}

var g_Vehicles = [
        {
            Year: "2011",
            Make: "abc",
            Model: "Avenger",
            SubModel: "def"
        },
        {
            Year: "2012",
            Make: "abc",
            Model: "200",
            SubModel: "deft"
        },
        {
            Year: "2011",
            Make: "dfg",
            Model: "300",
            SubModel: "sde"
        }
];

次に、それをループして、必要な種類のドロップダウンを生成できます。たとえば、selectドロップダウンを作成する1つの方法は次のとおりです。

var markup = ['<select>'];
$.each(g_Vehicles, function(index, vehicle) {
    markup.push('<option value=' + index + '>' +
                vehicle.Make + '-' + vehicle.Model + '-' + vehicle.SubModel +
                '</option>');
});
markup.push('</select>');
$("selector_for_some_container").html(markup.join(""));
于 2012-11-01T08:26:21.570 に答える
0

これは、JSONではなくJavaScriptオブジェクトリテラルです。

したがって、jQueryの$.each関数を使用します。

g_Vehicle.each(function(index) {
    $('select').append($('<option>' + g_Vehicle[index].Make + '</option>'));
});
于 2012-11-01T08:27:22.313 に答える
0

ここにあなたが始めるためのいくつかのコードがあります。入力するドロップダウンに応じて、これを拡張します。

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">

var g_Vehicle = [
    {
        Year: "2011",
        Make: "Ram",
        Model: "Avenger",
        SubModel: "Dart",
        Vin: "1C1"
    },
    {
        Year: "2012",
        Make: "Dodge",
        Model: "200",
        SubModel: "Dart",
        Vin: "1C2"
    },
    {
        Year: "2011",
        Make: "Chrysler",
        Model: "300",
        SubModel: "Durango",
        Vin: "1C3"
    }
];

var year="2011";

$(document).ready(function(){
    for(var i in g_Vehicle){
       if(g_Vehicle[i].Year == year){
           $('#make').append($('<option>' + g_Vehicle[i].Make + '</option>'));
       }
    }
});


</script>
<body>
<select id="make"></select>
</body>
</html>
于 2012-11-01T08:27:30.997 に答える
0

jQueryと一緒にやってください...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>
var g_Vehicle = {
  g_Vehicle1: {
      Year: "2011",
      Make: "abc",
      Model: "Avenger",
      SubModel: "def"
  },
  g_Vehicle2: {
      Year: "2012",
      Make: "abc",
      Model: "200",
      SubModel: "deft"
  },
  g_Vehicle3: {
      Year: "2011",
      Make: "dfg",
      Model: "300",
      SubModel: "sde"
  }
}

$(document).ready(function() {

    (function() {
        var l = '';
        for(var id in g_Vehicle) {
            l += '<option value="'+id+'">'+id+'</option>'           
        }
        $('#mymenu')
        .html(l)
        .change(function() {

            //Test here
            var r = g_Vehicle[$(this).val()];           
            alert('Year: ' + r.Year+'\nMake: ' + r.Make+'\nModel: ' + r.Model+'\nSubModel: ' + r.SubModel+'\n');

        });     
    })();
});
</script>
</head>
<body>
<form id="myform" name="myform">
<select id="mymenu" name="mymenu"></select>
</form>
</body>
</html>
于 2012-11-01T08:48:46.687 に答える