新客网WWW.XKER.COM:致力做中国最专业的网络学院!
学院: 操作系统 - 网络应用 - 服务器 - 网络安全 - 工具软件 - 办公软件 - Web开发 - 数据库 - 网页设计 - 图形图像 - 媒体动画 - 硬件学堂 - 存储频道 - QQ专区
您的位置:首页 > 软件开发 > Web开发 > JavaScript > 正文:用Javascript 实现的Dual listbox

用Javascript 实现的Dual listbox

新客网 XKER.COM 2006-07-17 来源: 收藏本文

   这是我用 JavaScript 制作的“Dual listbox”(双向选择器)的一个应用示例,是从我的代码中抠出来的。在网页编程中经常会用到。

 
  
 
    也许我的实现太烦琐了,希望大家有更好的代码贡献出来。

  <html>
  <head>
  <title>选择器</title>
  <link href="./style/style.css" rel="stylesheet" type="text/css">
   <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
  <meta http-equiv="Page-Enter" content="blendTrans(Duration=1.0)">
  <meta http-equiv="Page-Exit" content="blendTrans(Duration=1.0)">
  <script language="Javascript">
    function openwin(url, l, t, w ,h)
    {open(url,'','toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no,width='+ w +',height='+ h +',left='+ l +',top='+ t);}

    function check_and_submit(frm)
    {
      SelectAll(frm.SelectedItem);
      frm.submit();
    }
  </script>
  </head>

  <body>

  <form name="frm1" id="frm1" method="post" action="save.ASP">
  <input name="allowsubmit" type="hidden" value="OK">

  <table width="500" border="0" cellspacing="0" cellpadding="0" align="center">
  <tr height=10><td colspan=3></td></tr>
  <tr>
    <td width="220" align=center valign="top">
      已分配该用户管理的栏目:<br><br>


      <select name="SelectedItem" id="SelectedItem" size=12 multiple="true">
        <option>无</option>

      </select>
      </select>
    </td>
    <td width="60" align=center>
      <br><br>
      <button onClick="MoveSingleItem(WaitSelectItem, SelectedItem)">&lt;</button><br><br>
      <button onClick="MoveAllItems(WaitSelectItem, SelectedItem)">&lt;&lt;</button><br><br><br><br>
      <button onClick="MoveSingleItem(SelectedItem, WaitSelectItem)">&gt;</button><br><br>
      <button onClick="MoveAllItems(SelectedItem, WaitSelectItem)">&gt;&gt;</button><br>
    </td>
    <td width="220" align=center valign="top">
      待分配的栏目:<br><br>
      <select name="WaitSelectItem" size=12 multiple=true>
        <option>师大要闻</option>
        <option>视频新闻</option>

共3页: 上一页 [1] [2] [3] 下一页
收藏】 【评论】 【推荐】 【投稿】 【打印】 【关闭
发表评论
要记得去论坛讨论,点击注册新会员匿名评论
评论内容:不能超过250字,需审核后才会公布,请自觉遵守互联网相关政策法规。
阅读排行
随机推荐
实用信息推荐