将左边的内容 点击按钮 添加到右边去 谁会做

javascript的select-option mul类型

解决方案 »

  1.   


    <script>
    function moveselect(obj,target,all){
    if (!all) all=0
    if (obj!="[object]") obj=eval("document.all."+obj)
    target=eval("document.all."+target)
    if (all==0)
    {
       while (obj.selectedIndex>-1){
       //alert(obj.selectedIndex)
       mot=obj.options[obj.selectedIndex].text
       mov=obj.options[obj.selectedIndex].value
       obj.remove(obj.selectedIndex)
       var newoption=document.createElement("OPTION");
       newoption.text=mot
       newoption.value=mov
       target.add(newoption)
       }
    }
    else
    {
      //alert(obj.options.length)
      for (i=0;i<obj.length;i++)
       {
       mot=obj.options.text
       mov=obj.options.value
       var newoption=document.createElement("OPTION");
       newoption.text=mot
       newoption.value=mov
       target.add(newoption)
       }
    obj.options.length=0}}
    </script>
    <table border="1" width="373" id="table3" bordercolor="#000000" bgcolor="#FFFFFF" style="border-collapse: collapse" cellspacing="3" cellpadding="0" class=bd>
      <tr>
        <td>
          <table border="1" width="100%" id="table4" style="border-collapse: collapse" bordercolor="#808080" cellpadding="2" bgcolor="#EDF3F3" cellspacing="0">
            <tr>
              <td width="117" class=song_black_14 align="right">
                <p align="left"> <font size="2">111</font>
                    <select size="14" name="D1" ondblclick="moveselect(this,'D2')" multiple style="width:140px">
                      <option value="AAA">AAA</option>
                      <option value="SSS">SSS</option>
                      <option value="DDD">DDD</option>
                    </select>
              </td>
              <td width="117" class=song_black_14 align="right">           
                <p align="center">
                  <input type="button" value="&lt;" name="B5" onclick="moveselect('D2','D1')">
                <p align="center">
                  <input type="button" value="&gt;" name="B6" onclick="moveselect('D1','D2')">
              </td>
              <td width="117" class=song_black_14 align="right">
                <p align="left"> <font size="2">222</font>
                    <select size="14" name="D2" ondblclick="moveselect(this,'D1')" multiple style="width:140px">
                      <option value="ZZZ">ZZZ</option>
                      <option value="XXX">XXX</option>
                    </select>
              </td>
            </tr>
        </table></td>
      </tr>
    </table>
    </body>
    </html>不知道是什么时候的代码了 看着改成IE\FF兼容的吧
      

  2.   

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <script language="javascript">
    <!--
    function moveOption(e1,e2)
    {
      try
      {
        for(var i=0;i<e1.options.length;i++)
        {
          if(e1.options[i].selected)
          {
            var e = e1.options[i];
            e2.options.add(new Option(e.text, e.value));
            e1.remove(i);
            i=i-1
          }
        }
        document.getElementById('city').value=getvalue(document.getElementById('list2'));
      }
      catch(e){}
    }
    function getvalue(geto)
    {
      var allvalue = "";
      for(var i=0;i<geto.options.length;i++)
      {
        allvalue +=geto.options[i].value + ",";
      }
      return allvalue;
    }
    //-->
    </script>
    </head>
    <body>
    <form id="myform" name="myform" method="post">
      <table align="center" width="180" border="0">
        <tr>
          <td width="80" align="center">
            <select style="width:100%" multiple id="list1" name="list1" size="6" ondblclick="moveOption(this, document.getElementById('list2'))">
              <option value="北京">北京</option>
              <option value="上海">上海</option>
              <option value="重庆">重庆</option>
              <option value="天津">天津</option>
              <option value="陕西">陕西</option>
            </select>
          </td>
          <td width="20" align="center">
            <input type="button" value="添加" onclick="moveOption(document.getElementById('list1'), document.getElementById('list2'))"><br><br>
            <input type="button" value="删除" onclick="moveOption(document.getElementById('list2'), document.getElementById('list1'))">
          </td>
          <td width="80" align="center">
            <select style="width:100%" multiple id="list2" name="list2" size="6" ondblclick="moveOption(this, document.getElementById('list1'))">
            </select>
          </td>
        </tr>
      </table>
      <div align="center"><input type="text" id="city" name="city" size="23" /></div>
    </form>
    </body>
    </html>