根据第一个下拉列表中的项目选择填充第二个下拉列表答案

【问题标题】：populate 2nd dropdown based on selection of item in 1st dropdownlist根据第一个下拉列表中的项目选择填充第二个下拉列表
【发布时间】：2013-12-27 05:38:11
【问题描述】：

我有两个下拉列表 ddl1 和 ddl2。

现在在选择 ddl1 的项目时，应填充 ddl2 中的相应项目。

例如：- 如果我在 ddl1 中选择“帐户”，则 ddl2 应显示“帐户官、帐户经理、首席财务官”，对于 ddl1 中的其他字段，类似。我希望在没有任何数据库连接的情况下执行此操作（使用 ajax 或 Jquery）。应该有一个 xml 文件来存储下拉列表的数据。当我们点击第一个下拉菜单时，只有页面的下拉部分必须刷新，并且不应该有任何 php 和 .net 代码。我需要完整的代码才能这样做。请帮助我...... ..

【问题讨论】：

使用 JSON 代替 XML 文件，很简单。

标签： jquery ajax

【解决方案1】：

试试这样的

JAVASCRIPT 代码

$(function(){
    var json ={'A':['Apple','Aeroplane','America'],'B':['Banana','BAT','BAG']};
    $('#alphabet').change(function(){
        if(this.value !=''){
            var arr = json[this.value];
            var option="";
            $.each(arr,function(k,v){
                option+='<option value="'+v+'">'+v+'</option>';
            })
            $('#spelling').html(option);
        }
    })

})

HTML 代码

<select id="alphabet">
    <option value="">SELECT</option>
    <option value="A">A</option>
    <option value="B">B</option>
</select>
<select id="spelling"></select>

【讨论】：

【解决方案2】：

这是你的 Json

{"Accounts": [
"Account officer",
"Account manager",
"Chief Financial Officer"],
"HR":[
"HR Head",
"Intern"]
}

等等..

【讨论】：