如何设置选择框或下拉列表框的值作为上一个列表框值设置[重复]答案

【问题标题】：How to set values for select box or drop down list box as the previous list box value is set [duplicate]如何设置选择框或下拉列表框的值作为上一个列表框值设置[重复]
【发布时间】：2012-10-06 10:37:21
【问题描述】：

可能重复：
Use jquery to change second select list based on first select list option

我的代码中有两个选择元素。一个用于州 (#us_state)，第二个用于城市 (#city_name)。当我选择“州”时，第二个选择元素必须仅包含处于选定州的城市。

【问题讨论】：

你有某种数据源来填充这两个选择吗？此外，与往常一样，您当前的代码会有所帮助......无论是在这里发布还是通过小提琴

标签： php javascript jquery

【解决方案1】：

一种可能的解决方案：

var data = {
    "State 1": ["City 1", "City 2"],
    "State 2": ["City 3", "City 4"],
    "State 3": ["City 5", "City 6", "City 7"]
};

var $states = $("#us_state").on("change", function() {
    var $cities = $.map(data[this.value], function(city) {
        return $("<option />").text(city);
    });
    $("#city_name").empty().append($cities);
});

for (var state in data) {
    $("<option />").text(state).appendTo($states);
}

演示： http://jsfiddle.net/8hbcP/

【讨论】：

【解决方案2】：

使用 jquery append 附加选项值（还记得使用

清除迭代循环之外的选项

$('#city_name').html("");

$('#city_name').append('<option value="'+city+'">'+city+'</option>');

【讨论】：