更改选择框的选项基于另一个选择框上的选择值

Question

考虑两个选择框A＆amp; B

A有选项：car，bike。

B有选项car1，car2，bike1，bike2

选择car时选择框A，然后选择框B应该只包含以下选项car1和car2

怎么做？感谢。

Answer 1

<select id="vehicle">
    <option>car</option>
    <option>bike</option>
</select>

<select id="vehicle-type">
    <option>--</option>
    <option vehicle="car">car1</option>
    <option vehicle="car">car2</option>
    <option vehicle="bike">bike1</option>
    <option vehicle="bike">bike2</option>
</select>

$(function() {
    $('#vehicle').on('change', function() {
        var vehileType = $('#vehicle').val();

        $('#vehicle-type option').hide();
        $('#vehicle-type option[vehicle="'+vehileType+'"]').show();        
    });
});

您可以尝试这个JSFiddle示例：

http://jsfiddle.net/tt2AD/