尝试这样的东西..我不得不稍微改变数据对象的结构。接下来得到下拉列表的值，你可以做 .val（）

  var data = {
'ten'：{
'eleven'：[11，1111，111111]，
'十二'：[12，1212，121212] 
}，
'二十'：{
'二十一'：[21，2121，212121]，
'twentytwo'：[22，2222，222222] 
} 
}，
 $ a = $（'＃a'）; //下拉列表
 $ b = $（'＃b'）; 
 $ c = $（'＃c'）; 

 for（var prop in data）{
 var first = prop; 
 $ a.append（$（< option>）//添加选项
 attr（value，first）
 text（first））; 
} 

 $ a.change（function（）{
 var firstkey = $（this）.val（）; 
 $ b.html（''） ; //清除第二个下拉列表中的现有选项
 for（var prop in data [firstkey]）{
 var second = prop; 
 $ b.append（$（< option> ）//添加选项
 attr（value，second）
 text（second））; 
} 
 $ b.change（）; 
} ）。更改（）; //触发一次加载首选项

 $ b.change（function（）{
 var firstKey = $ a.val（），
 secondKey = $ （这个）.val（）; 
 $ c.html（''）; //清除第二个下拉列表中的现有选项
 for（var i = 0; i< data [firstKey] [secondKey] $ l 
 $ c.append（$（< option>）//添加选项
 attr（value，third）。
 text（third））; 
} 
 $ c.change（）; 
}）。 
 

检查小提琴

I am new to Java script. Here I have working example for 2 drop down Fiddle .

HTML:

<select id=a></select>
<select id=b></select>
<select id=c></select>

JavaScript:

var data = [ // The data
    ['ten', [
        'eleven','twelve'
    ]],
    ['twenty', [
        'twentyone', 'twentytwo'
    ]]
];

$a = $('#a'); // The dropdowns
$b = $('#b');

for(var i = 0; i < data.length; i++) {
    var first = data[i][0];
    $a.append($("<option>"). // Add options
       attr("value",first).
       data("sel", i).
       text(first));
}

$a.change(function() {
    var index = $(this).children('option:selected').data('sel');
    var second = data[index][2]; // The second-choice data

    $b.html(''); // Clear existing options in second dropdown

    for(var j = 0; j < second.length; j++) {
        $b.append($("<option>"). // Add options
           attr("value",second[j]).
           data("sel", j).
           text(second[j]));
    }
}).change(); // Trigger once to add options at load of first choice

Let me know how to add one more drop down in this code.

Thanks

Try something like this.. I had to slightly change the structure of the data object. Next to get the value of the dropdown you can just do .val()

var data = {
    'ten': {
        'eleven': [11, 1111, 111111],
        'twelve': [12, 1212, 121212]
    },
    'twenty': {
        'twentyone': [21, 2121, 212121],
        'twentytwo': [22, 2222, 222222]
    }
},
$a = $('#a'); // The dropdowns
$b = $('#b');
$c = $('#c');

for (var prop in data) {
    var first = prop;
    $a.append($("<option>"). // Add options
    attr("value", first).
    text(first));
}

$a.change(function () {
    var firstkey = $(this).val();
    $b.html(''); // Clear existing options in second dropdown
    for (var prop in data[firstkey]) {
        var second = prop;
        $b.append($("<option>"). // Add options
        attr("value", second).
        text(second));
    }
    $b.change();
}).change(); // Trigger once to add options at load of first choice

$b.change(function () {
    var firstKey = $a.val(),
        secondKey = $(this).val();
    $c.html(''); // Clear existing options in second dropdown
    for(var i = 0; i < data[firstKey][secondKey].length; i++) {
        var third = data[firstKey][secondKey][i]
        $c.append($("<option>"). // Add options
        attr("value", third).
        text(third));
    }
    $c.change();
}).change();

Check Fiddle