1

我试过搜索这个，所有的答案都在我头上，只是让我感到困惑和沮丧......我要做的就是从选择的左侧列表中选择一个选项，移动到右侧列表当我单击一个按钮时。这是我正在尝试使用的脚本，它对我不起作用......

function moveRight() {
var selItem = document.forms[0].leftList.selectedIndex;

 if (selItem == -1) {
  window.alert("You must first select an item on the left side.")
 }

 else {
  var selText = document.forms[0].leftList[selItem].text;
  var selValue = document.forms[0].leftList[selItem].value;
  var nextItem = document.forms[0].rightList.length;

  document.forms[0].rightList[nextItem].text = selText;
  document.forms[0].rightList[nextItem].value = selValue;
 }
}

关于如何在不使事情过于复杂的情况下完成这项工作的任何想法？

4

5 回答 5

3

您的代码中存在三个问题：

  1. 使用document.getElementById代替document.forms[0].leftList
  2. 使用cloneNodeandremoveChild和appendChild移动你的元素
  3. 我没有看到你在调用你的函数的任何地方moveRight。必须添加一个onchange事件

示例代码：

function moveRight() {
    var leftlist = document.getElementById("leftList");
    var selItem = leftlist.selectedIndex;

    if (selItem == -1) {
        window.alert("You must first select an item on the left side.")
    } else {
        var rightlist = document.getElementById("rightList");
        var newOption = leftlist[selItem].cloneNode(true);

        leftlist.removeChild(leftlist[selItem]);
        rightlist.appendChild(newOption);
    }
}

document.getElementById('leftList').onchange = moveRight;
于 2013-11-01T02:33:08.637 回答
0

你在使用一种常见的 js 库（Mootools/jQuery）吗？
如果没有，请阅读此处https://developer.mozilla.org/en-US/docs/Web/API/Node.appendChild 最后有一个关于如何删除 dom 元素的链接，以及我给你的链接，是如何在你需要的地方附加 dom 元素。

干杯

于 2013-11-01T02:16:44.877 回答
0 
var nextItem = document.forms[0].rightList.length;

document.forms[0].rightList[nextItem].text = selText;
document.forms[0].rightList[nextItem].value = selValue;

到

var option = document.createElement("option");
option.value = selValue;
option.text = selText;

document.forms[0].rightList.appendChild(option);
于 2013-11-01T02:29:22.493 回答
0

有很多方法可以实现您想要实现的目标。我不知道您的要求，这就是为什么我试图使代码尽可能接近您尝试的内容。

function moveRight() {
    var selItem = document.forms[0].leftList.selectedIndex;
    if (selItem == -1) {
        window.alert("You must first select an item on the left side.")
    } else {
        document.forms[0].rightList.add(document.forms[0].leftList[selItem], null);
    }
}

在http://jsfiddle.net/Z8xRp/3/上检查它

于 2013-11-01T02:38:38.863 回答
0

我有点晚了，但这是一个解决方案（在多个选择之间移动）我只是从旧解决方案中更改了一些行

演示：http: //jsfiddle.net/rTxb8/

    function moveRight() {
    var selItem = document.forms[0].leftList.selectedIndex;
    if (selItem == -1) {
        window.alert("You must first select an item on the left side.")
    } else {
        document.forms[0].rightList.add(document.forms[0].leftList[selItem], null);
    }
}

function moveLeft() {
    var selItem = document.forms[0].rightList.selectedIndex;
    if (selItem == -1) {
        window.alert("You must first select an item on the left side.")
    } else {
        document.forms[0].leftList.add(document.forms[0].rightList[selItem], null);
    }
}
于 2014-04-24T16:30:47.093 回答