根据更改事件填充选择下拉列表

populating select dropdowns dependent on change event

本文关键字:填充 选择 下拉列表 事件      更新时间:2023-09-26

嗨,我几乎完成了填充选择下拉列表然后输出相关数字的小任务。选择公司等有效。

这是我的JSFiddle:http://jsfiddle.net/3MK3D/1/

我现在需要在选择下拉列表中生成适当的公司,具体取决于所选的部门。我为个人公司创建了一个新的 JavaScript 数组。

我想过也许做这样的事情并将正确的变量传递给适当的函数,但不确定如何实现它:

var companiesArray;
    $('#sector').on('change', function(e){
        var optionSelected = $("option:selected", this);
        var sectorSelected = this.value;
        if( sectorSelected == 'business' ) {
            companiesArray = 'insurancecompanies';
        } else if( sectorSelected == 'personal' ) {
            companiesArray = 'personalcompanies';
        } else {
        }
    });

可能有更好的方法?

使用具有sector选择值作为相关数组键的 companies 对象:

var companies = {
    business : [
        { 
            name : 'Advent', 
            property : '01242 674 674', 
            fleet : '', 
            motortrade : ''
        },
        {   
            name : 'Allianz', 
            property : '0844 412 9988', 
            fleet : '0800 587 5858', 
            motortrade : '' 
        },
        // other insurance companies
    ],
    personal : [
        // personal companies
    ]
}

然后:

$('#sector').on('change', function(e){
    var optionSelected = $("option:selected", this);
    var sectorSelected = this.value;
    var companyArray = companies[sectorSelected];
    // iterate over companyArray and create the relevant option objects for #company
});