保存下拉列表的选定值,并默认将其分配到另一个下拉列表/复制下拉列表中,可以通过以下步骤实现:
<select id="sourceList">
<option value="value1">Option 1</option>
<option value="value2">Option 2</option>
<option value="value3">Option 3</option>
</select>
<select id="targetList">
<!-- Target list will be populated based on the selected value from source list -->
</select>
document.getElementById("sourceList").addEventListener("change", function() {
// Call a function to update the target list based on the selected value
updateTargetList(this.value);
});
function updateTargetList(selectedValue) {
var targetList = document.getElementById("targetList");
// Clear existing options
targetList.innerHTML = "";
// Add new options based on the selected value
switch(selectedValue) {
case "value1":
targetList.add(new Option("Option A", "optionAValue"));
targetList.add(new Option("Option B", "optionBValue"));
break;
case "value2":
targetList.add(new Option("Option X", "optionXValue"));
targetList.add(new Option("Option Y", "optionYValue"));
targetList.add(new Option("Option Z", "optionZValue"));
break;
case "value3":
targetList.add(new Option("Option P", "optionPValue"));
break;
default:
// Add a default option if no match found
targetList.add(new Option("No options available", ""));
}
}
通过上述步骤,当源下拉列表的选项更改时,目标下拉列表会根据选定的值进行更新。
领取专属 10元无门槛券
手把手带您无忧上云