如何让两个DropDownList下拉列表同步选中相同值？

你之前的JavaScript代码错误在于直接赋值DOM元素，这无法实现选中值同步。正确做法是操作下拉框的value属性，并通过监听change事件实现实时同步。

代码实现 #

// 获取两个下拉框的DOM元素
const dropdownIddd = document.getElementById("iddd");
const dropdownCategory = document.getElementById("MyCategory");

// 定义同步选中值的函数
function syncSelectedValue(source, target) {
    target.value = source.value;
}

// 监听第一个下拉框的变化，同步到第二个
dropdownIddd.addEventListener('change', function() {
    syncSelectedValue(this, dropdownCategory);
});

// 监听第二个下拉框的变化，同步到第一个
dropdownCategory.addEventListener('change', function() {
    syncSelectedValue(this, dropdownIddd);
});

// 页面加载完成时初始化同步（可选，确保初始状态一致）
syncSelectedValue(dropdownIddd, dropdownCategory);

说明 #

• 当任意一个下拉框的选中项改变时，change事件会触发同步逻辑，将另一个下拉框的选中值设置为相同值。
• 页面加载时的初始化同步可以保证两个下拉框初始状态一致，不需要的话可删除最后一行代码。

内容的提问来源于stack exchange，提问作者lopez cesar