如何使用Razor中的Javascript将项目同时添加到多个下拉列表中？

我正在创建一个MVC表单，我有多个复选框和两个下拉列表。我已经了解了如何根据选中的框填充第一个DDL（即开始时为空，复选框填充项目）。但是，我想添加另一个具有相同项并以相同方式填充的DDL。我的代码如下所示：

<script type="text/javascript">
    function checkedToggle(value, checked) {
        x = document.getElementById("filter1");
        y = document.getElementById("filter2");
        if (checked == true) {
            var option = document.createElement("option");
            option.text = value;
            x.add(option, null);
            y.add(option, null);
        }
        else {
            for (i = 0; i < x.length; i++) {
                if (x.options[i].value == value) {
                    x.remove(i);
                    y.remove(i);
                }
            }
        }
    }
</script>

函数checkedToggle（值，选中）{
x=document.getElementById（“过滤器1”）；
y=document.getElementById（“过滤器2”）；
如果（选中==true）{
var option=document.createElement（“选项”）；
option.text=值；
x、 添加（选项，空）；
y、 添加（选项，空）；
}
否则{
对于（i=0；i

一旦取消选中该框，else语句显然会从列表中删除一项

---

现在，当你点击一个复选框，而不是将该项添加到两个列表中，它只会添加到第二个列表中，我不知道为什么。有什么建议吗？

您需要创建两个元素，因为在代码中，您只需将第一个DOM元素移动到第二个select元素

var option = document.createElement("option");
var option2 = document.createElement("option");

option.text = value;
option2.text = value;

x.add(option, null);
y.add(option2, null);