JavaScript + 将项目添加到下拉列表中

标签 javascript drop-down-menu

我的 JSP 页面中有两个下拉菜单

1. lstA
     test1
     test2
     test3
     test4

2. lstB

现在在选择 lstA 时,我想将 lstA 的所有项目填充到 lstB 中,除了选择的项目,lstA 的内容也应该保持不变。

我怎样才能做到这一点?

我尝试这样做,但是从 lstA 中删除了一些随机项目,这是非常有线的。

最佳答案

你的答案几乎是正确的。

注意事项:添加之前需要清空客户端列表,否则最后会出现越来越多的项目,添加到客户端列表前需要克隆选项,因为一个节点可以任何时候都只存在于 1 个 parent 中。

这已经过测试并且对我有用:

<html><body>
<script language="javascript">
function populateClient() {
     var serverList = document.getElementById("dropdown1");
     var clientList = document.getElementById("dropdown2");

     clientList.options.length = 0; // this removes existing options

     for (var i = 0; i <= serverList.options.length; i++) {
         if (!serverList.options[i].selected) {
             clientList.options.add(serverList.options[i].cloneNode(true)); // cloneNode here
         }
     }
 }
</script>

<select id="dropdown1" onchange="populateClient()">
    <option value="value1">value1</option>
    <option value="value2">value2</option>
    <option value="value3">value3</option>
    <option value="value4">value4</option>
    <option value="value5">value5</option>
</select>
<select id="dropdown2">
</select>
</body></html>

关于JavaScript + 将项目添加到下拉列表中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2623298/

相关文章:

CSS 忽略溢出 : hidden

objective-c - 带有图像和文本的 NSMenuItem

javascript - 使用 angularjs 对字符串的一部分进行子串

javascript - 使用变量指定选择框获取更改选择框的选定值

HTML 表单控制换行

javascript - 根据选择框中的选项显示单选按钮

javascript - 如何在不重新加载页面的情况下更改地址栏中的 URL?

javascript - 如何在 Node js中获取第二个数组?

javascript - 显示 2 后在 slider 中显示 1 张图片

javascript - 在 Cookie JavaScript 中存储空格和冒号