组合框更改事件

ComboBox onChange event

本文关键字:事件 组合      更新时间:2023-09-26

我是 JavaScript 的新手。我在 jsp 页面上有 3 个选择:

<select id="railwayServiceList" name="railwayService_id" 
    onchange="changeCompaniesCombo()"></select>
<select id="companyList" name="company_id" 
    onchange="changeCompaniesCombo()"></select>
<select id="departmentList" name="department_id"></select>

和 JavaScript 函数用于onChange()事件:

function changeCompaniesCombo() {
    var railwayServiceList = document.getElementById("railwayServiceList");
    var companyList = document.getElementById("companyList");
    var selected = railwayServiceList.value;
    while (companyList.options.length) {
        companyList.remove(0);
    }
    <c:forEach items="${companies}" var="company" varStatus="loopStatus">
        if ("${company.railwayService}" == selected) {
            var option = new Option("${company.name}", "${company}");
            companyList.options.add(option);
        }
    </c:forEach>
}
function changeDepartmentCombo() {
    var departmentList = document.getElementById("departmentList");
    var companyList = document.getElementById("companyList");
    var selected = companyList.value;
    while (departmentList.options.length) {
        departmentList.remove(0);
    }
    <c:forEach items="${selected.departments}" var="department" varStatus="loopStatus">
        var option = new Option("${department.name}", "${department.id}");
        companyList.options.add(option);
    </c:forEach>
}

它工作正常,但也许有某种方法可以为所有选择创建一个通用函数?(我有 8 个选择)。数据模型由Spring MVC控制器生成。

jQuery的链式选择插件解决了我的问题