动态添加/删除依赖选择框。
代码示例:
HTML:
JavaScript:
var carModels = {
audi: ["A3", "A4", "A5", "Q3", "Q5"],
bmw: ["2 Series", "3 Series", "4 Series", "5 Series", "7 Series", "X3", "X5"],
mercedes: ["C-Class", "E-Class", "S-Class", "GLC", "GLA"]
};
var carSelect = document.getElementById("car");
var modelSelect = document.getElementById("model");
carSelect.addEventListener("change", function() {
var selectedCar = carSelect.value;
while (modelSelect.options.length > 0) {
modelSelect.remove(0);
}
var carModelsList = carModels[selectedCar];
if (carModelsList) {
modelSelect.disabled = false;
var option;
for (var i = 0; i < carModelsList.length; i++) {
option = document.createElement("option");
option.value = carModelsList[i];
option.text = carModelsList[i];
modelSelect.add(option);
}
} else {
modelSelect.disabled = true;
}
});
以上代码演示了如何实现一个动态添加/删除依赖选择框的示例。该示例包含两个选择框,根据第一个选择框中选中的车品牌动态更新第二个选择框中的车型。可根据实际情况修改代码。