一段有趣并且实用的程序--利用javascript和dhtml实现两个列表框中内容的移动。（代码见内，把它存为一个...

作者： unknow

<table width=400 align=center border=0>

   <tr>
     <td width=40% align=center>
         列表一
     </td>
     <td width=20% align=center>
         操作
     </td>
     <td width=40% align=center>
         列表二
     </td>
   </tr>
   <tr>
      <td width=40% align=center>
          <form name=form1>
            <select size=10  name=select1 MULTIPLE>
              <option value=1>Sample string 1</option>
              <option value=2>Sample string 2</option>
              <option value=3>Sample string 3</option>
              <option value=4>Sample string 4</option>
              <option value=5>Sample string 5</option>

            </select>
          </form>
      </td>
      <td valign=middle width=20% align=center>
          <br>
          <br>
           <input type=button name=btnGoLeft onclick="Go_Left();" value="<<">
          <br>
          <br>
           <input type=button name=btnGoRight onclick="Go_Right();" value=">>">
          <br>
          <br>
      </td>
      <td width=40% align=center>
          <form name=form2>
            <select size=10 length=40 name=select2 MULTIPLE >
           </select>
          </form>
      </td>
  </tr>
</table>

<script language=javascript>
  //将列表框1中的选定部分移到列表框2中
  function Go_Left()
     {

       for (i=0 ; i<=form2.select2 .options .length -1 ; i++)
          {
            //如果这条被选中则复制倒列表框1中
            if (form2.select2 .options [i].selected)
              {
                var element = window.Option.create (form2.select2.options [i].text,
                               form2.select2 .options[i].value,0);
                form1.select1.add (element);
              }

          }
       var j = 0 ;

       //删除选定记录
       for (i=0 ; i< form2.select2 .options .length ; i++)
          {
            if (form2.select2 .options [i].selected)
              {
                form2.select2.remove(i);
                i = i - 1 ;
              }

          }
    }

  //将列表框2中的选定部分移到列表框1中
  function Go_Right()
     {
       for (i=0 ; i<=form1.select1 .options .length -1 ; i++)
          {
            if (form1.select1 .options [i].selected )
              {
                var element = window.Option.create (form1.select1.options [i].text,
                               form1.select1 .options[i].value,0);
                form2.select2.add (element);
              }

          }
       for (i=0 ; i< form1.select1 .options .length ; i++)
          {
            if (form1.select1 .options [i].selected )
              {
                form1.select1.remove(i);
                i = i - 1 ;
              }

          }


     }

</script>

返回顶部

下一篇：动态菜单的另一种实现（一） category.js >>