关于list。如何将某Option改变它的排列顺序？

Question

我用下面这个方法可以实现上移，但是如何使某option上移后仍然处于选中的状态（就是变为高亮）？function moveup() {
    var i = document.tableForm.displayfield.selectedIndex;    if (i > 0) {
        var t = document.tableForm.displayfield.options[i].text;
        var v = document.tableForm.displayfield.options[i].text;
        document.tableForm.displayfield.remove(i);        var oOption = document.createElement("OPTION");
        document.tableForm.displayfield.options.add(oOption, i - 1);
        oOption.innerText = t;
        oOption.value = v;    }
}

Answer 1

又是我自己解决的。
1？为什么说又呢？加上两行，搞定。        document.tableForm.displayfield.focus();
        document.tableForm.displayfield.options[i - 1].selected = true;感谢msdn.microsoft.com。
谁来回复给谁分好了。

Answer 2

没人看到啊？还是太简单了？
把相关代码都贴上来了。
主要就是左右两个List，可以全部/单独把左侧的移到右侧，或者把右侧的全部/单独删除。右侧的顺序还可以调整。
算是散代码么？<script>
function addall() {
    var i;
    for (i = 0; i < document.Form1.leftlist.length; i++) {
        var oOption = document.createElement("OPTION");
        document.Form1.rightlist.options.add(oOption);
        oOption.innerText = document.Form1.leftlist.options[i].text;
        oOption.value = document.Form1.leftlist.options[i].text;
    }
    for (i = document.Form1.leftlist.length - 1; i >= 0; i--) {
        document.Form1.leftlist.remove(i);
    }
}function addone() {
    var i = document.Form1.leftlist.selectedIndex;
    if (i != -1) {
        var oOption = document.createElement("OPTION");
        document.Form1.rightlist.options.add(oOption);
        oOption.innerText = document.Form1.leftlist.options[i].text;
        oOption.value = document.Form1.leftlist.options[i].text;
        document.Form1.leftlist.remove(i);
    }
}function removeall() {
    var i;
    for (i = 0; i < document.Form1.rightlist.length; i++) {
        var oOption = document.createElement("OPTION");
        document.Form1.leftlist.options.add(oOption);
        oOption.innerText = document.Form1.rightlist.options[i].text;
        oOption.value = document.Form1.rightlist.options[i].text;
    }
    for (i = document.Form1.rightlist.length - 1; i >= 0; i--) {
        document.Form1.rightlist.remove(i);
    }
}function removeone() {
    var i = document.Form1.rightlist.selectedIndex;
    if (i != -1) {
        var oOption = document.createElement("OPTION");
        document.Form1.leftlist.options.add(oOption);
        oOption.innerText = document.Form1.rightlist.options[i].text;
        oOption.value = document.Form1.rightlist.options[i].text;
        document.Form1.rightlist.remove(i);
    }
}function moveup() {
    var i = document.Form1.rightlist.selectedIndex;
    if (i > 0) {
        var t = document.Form1.rightlist.options[i].text;
        var v = document.Form1.rightlist.options[i].text;
        document.Form1.rightlist.remove(i);        var oOption = document.createElement("OPTION");
        document.Form1.rightlist.options.add(oOption, i - 1);
        oOption.innerText = t;
        oOption.value = v;        document.Form1.rightlist.focus();
        document.Form1.rightlist.options[i - 1].selected = true;
    }
}function movedown() {
    var i = document.Form1.rightlist.selectedIndex;
    if (i >= 0 && i < document.Form1.rightlist.length - 1) {
        var t = document.Form1.rightlist.options[i].text;
        var v = document.Form1.rightlist.options[i].text;
        document.Form1.rightlist.remove(i);        var oOption = document.createElement("OPTION");
        document.Form1.rightlist.options.add(oOption, i + 1);
        oOption.innerText = t;
        oOption.value = v;        document.Form1.rightlist.focus();
        document.Form1.rightlist.options[i + 1].selected = true;
    }
}
</script><form name="Form1" method="post" action="">
<center>
  <table width="80%" border="0">
    <tr> 
      <td rowspan="4" width="25%">
        <select name="leftlist" size="6" style="width:80pt">
          <option value="test1">test1</option>
          <option value="test2">test2</option>
          <option value="test3">test3</option>
          <option value="test4">test4</option>
          <option value="test5">test5</option>
          <option value="test6">test6</option>
          <option value="test7">test7</option>
          <option value="test8">test8</option>
        </select>
      </td>
      <td width="25%">
        <input type="button" name="button1" value=">>" onClick="addall();" style="width: 45pt">
      </td>
      <td rowspan="4" width="25%">
        <select name="rightlist" size="6" style="width:80pt">
        </select>
      </td>
      <td width="25%">&nbsp;</td>
    </tr>
    <tr> 
      <td><input type="button" name="button2" value=">" onClick="addone();" style="width: 45pt"></td>
      <td><input type="button" name="button3" value="上移" onClick="moveup();" style="width: 45pt"></td>
    </tr>
    <tr> 
      <td><input type="button" name="button4" value="<" onClick="removeone();" style="width: 45pt"></td>
      <td><input type="button" name="button5" value="下移" onClick="movedown();" style="width: 45pt"></td>
    </tr>
    <tr> 
      <td><input type="button" name="button6"  value="<<" onClick="removeall();" style="width: 45pt"></td>
      <td>&nbsp;</td>
    </tr>
  </table>
</center>
</form>

Answer 3

<script>
function moveSelected(select, down)
{
  if (select.selectedIndex != -1) {
    if (down) {
      if (select.selectedIndex != select.options.length - 1)
        var i = select.selectedIndex + 1;
      else
        return;
    }
    else {
      if (select.selectedIndex != 0)
        var i = select.selectedIndex - 1;
      else
        return;
    }
    var swapOption = new Object();
    swapOption.text = select.options[select.selectedIndex].text;
    swapOption.value = select.options[select.selectedIndex].value;
    swapOption.selected = select.options[select.selectedIndex].selected;
    swapOption.defaultSelected = select.options[select.selectedIndex].defaultSelected;
    for (var property in swapOption)
      select.options[select.selectedIndex][property] = select.options[i][property];
    for (var property in swapOption)
      select.options[i][property] = swapOption[property];
  }
}
function getSelectOrder(obj)
{var str = "<itemorders>";
for(var i = 0;i<obj.selectName.options.length;i++)
{
str += "<item><itemorder>" + (i + 1) + "</itemorder><href>" + obj.selectName.options[i].value + "</href></item>"
}
str += "</itemorders>"
obj.getXMLOrder.value = str
alert(obj.getXMLOrder.value)
}</script>
<body onload="document.formName.selectName.size=document.formName.selectName.options.length">
<table class="CustOuterTable" width="98%" border="0" cellspacing="0" cellpadding="0" align="center">
<form action="" method="post" name="formName" onsubmit="return getSelectOrder(this)">
<tr><td style="padding-top:4px;">
<table>
<tr>
<td style="padding-left:10px">
<select name="selectName" size="100">
<option value="http://lucky.myrice.com/">AAAAA</option>
<option value="News/">bbbb</option>
<option value="Law/">CCCC</option>
<option value="Exam/">FFFF</option></select>
</td>
<td>
<input type="button" value="↑" class="CustButton" onclick="moveSelected(this.form.selectName, false)" />
<br />
<input type="button" value="↓" class="CustButton" onclick="moveSelected(this.form.selectName, true)" />
</td>
</tr>
</table>
<br />
<div style="padding:6px" align="right">
<input type="hidden" value="" name="getXMLOrder" />
<input type="submit" value=" 确 定 "/>
</div>
</td>
</tr>
</form>
</table>

Answer 4

1.
function moveup() {
    with(document.Form1.rightlist){
    i=selectedIndex;
    if (i > 0) {
tmp=new Option(options[i].text,options[i].value);
options[i]=new Option(options[i-1].text,options[i-1].value);
options[i-1]=tmp;
selectedIndex=i-1;
    }
    }
}

Answer 5

2.
function moveup() {
    with(document.Form1.rightlist){
    i=selectedIndex;
    if (i > 0) {
tmp=new Option(options[i].text,options[i].value);
options[i]=new Option(options[i-1].text,options[i-1].value);
(options[i-1]=tmp).selected=true;
    }
    }
}