js Select下拉列表框进行多选、移除、交换内容的具体实现方法


Posted in Javascript onAugust 13, 2013
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<span class='wp_keywordlink_affiliate'><a href="tag/html" title="查看 html 中的全部文章" target="_blank">html</a></span>4/loose.dtd">
<<span class='wp_keywordlink_affiliate'><a href="tag/html" title="查看 html 中的全部文章" target="_blank">html</a></span>>
<head>
<title>Select下拉列表框进行多选、移除、交换内容</title>
<meta http-equiv="Content-Type" content="text/<span class='wp_keywordlink_affiliate'><a href="tag/html" title="查看 html 中的全部文章" target="_blank">html</a></span>; charset=gb2312">
</head>
<body style="font-size:12px">
<form name="form1" method="post" action="">
<table width="380" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="150"><table width="150" border="0" cellpadding="1" cellspacing="1" bgcolor="#CAFAFC">
      <tr>
        <td height="25" background="wp-content/uploads/2012/05/79760-772704496-8.gif" bgcolor="#FFFFFF"> 请选择:</td>
      </tr>
      <tr>
        <td align="center" bgcolor="#FFFFFF"><select name="sel_place1" size="6" multiple id="sel_place1" style="width:100px " >
          <option value="sel1">江苏省</option>
          <option value="sel2">广东省</option>
          <option value="sel3">河南省</option>
          <option value="sel4">吉林省</option>
          <option value="sel5">浙江省</option>
        </select></td>
      </tr>
    </table></td>
    <td width="80" align="center" valign="bottom"><input name="sure1" type="button" id="sure1"
  onClick="allsel(document.form1.sel_place2,document.form1.sel_place1);" value="<<">
  <input name="sure2" type="button" id="sure2"
  onClick="allsel(document.form1.sel_place1,document.form1.sel_place2);" value=">>" align="center" height="2"></td>
    <td width="150"><table width="150" border="0" cellpadding="1" cellspacing="1" bgcolor="#CAFAFC">
      <tr>
        <td height="25" background="wp-content/uploads/2012/05/79760-772704496-8.gif" bgcolor="#FFFFFF">
 请选择:</td>
      </tr>
      <tr>
        <td align="center" bgcolor="#FFFFFF"><select name="sel_place2" size="6" multiple id="sel_place2" style="width:100px ">
            </select></td>
      </tr>
    </table></td>
  </tr>
</table>
</form>
<script language="javascript">
function allsel(n1,n2)
{
  while(n1.selectedIndex!=-1)
  {
   var indx=n1.selectedIndex;
   var t=n1.options[indx].text;
   n2.options.add(new Option(t));
   n1.remove(indx);
  }
}
</script>
</body>
</html></td>
   </tr>
 </table>
Javascript 相关文章推荐
javascript 词法作用域和闭包分析说明
Aug 12 Javascript
jQuery循环滚动展示代码 可应用到文字和图片上
May 11 Javascript
JavaScript实现16进制颜色值转RGB的方法
Feb 09 Javascript
常用原生JS兼容性写法汇总
Apr 27 Javascript
JavaScript仿微信打飞机游戏
Jul 05 Javascript
移动端手指放大缩小插件与js源码
May 22 Javascript
Vue.js学习笔记之修饰符详解
Jul 25 Javascript
基于JavaScript实现简单的音频播放功能
Jan 07 Javascript
vue模块拖拽实现示例代码
Mar 09 Javascript
详解elementui之el-image-viewer(图片查看器)
Aug 30 Javascript
vue-cli3中配置alias和打包加hash值操作
Sep 04 Javascript
Vue 列表页带参数进详情页的操作(router-link)
Nov 13 Javascript
jquery二级导航内容均分的原理及实现
Aug 13 #Javascript
模拟多级复选框效果的jquery代码
Aug 13 #Javascript
javascript 树形导航菜单实例代码
Aug 13 #Javascript
Jquery操作下拉框(DropDownList)实现取值赋值
Aug 13 #Javascript
javascript实现div浮动在网页最顶上并带关闭按钮效果实例
Aug 13 #Javascript
鼠标经过显示二级菜单js特效
Aug 13 #Javascript
Jquery实现搜索框提示功能示例代码
Aug 13 #Javascript
You might like
PHP中调用JAVA
2006/10/09 PHP
php while循环得到循环次数
2013/10/26 PHP
cakephp打印sql语句的方法
2015/02/13 PHP
iOS自定义提示弹出框实现类似UIAlertView的效果
2016/11/16 PHP
laravel5.2实现区分前后台用户登录的方法
2017/01/11 PHP
如何正确使用Nodejs 的 c++ module 链接到 OpenSSL
2014/08/03 NodeJs
jQuery对val和atrr(&quot;value&quot;)赋值的区别介绍
2014/09/26 Javascript
node.js中的buffer.Buffer.isEncoding方法使用说明
2014/12/14 Javascript
jQuery实现瀑布流的取巧做法分享
2015/01/12 Javascript
JQuery球队选择实例
2015/05/18 Javascript
JavaScript Date对象详解
2016/03/01 Javascript
微信小程序 火车票查询实例讲解
2016/10/17 Javascript
Bootstrap CSS组件之分页(pagination)和翻页(pager)
2016/12/17 Javascript
node koa2实现上传图片并且同步上传到七牛云存储
2017/07/31 Javascript
JS实现匀加速与匀减速运动的方法示例
2017/09/04 Javascript
详解mpvue开发小程序小总结
2018/07/25 Javascript
JS实现指定区域的全屏显示功能示例
2019/04/25 Javascript
利用js-cookie实现前端设置缓存数据定时失效
2019/06/18 Javascript
绘制微信小程序验证码功能的实例代码
2021/01/05 Javascript
[31:00]2014 DOTA2华西杯精英邀请赛5 24 NewBee VS iG
2014/05/25 DOTA
[06:44]2014DOTA2国际邀请赛-钥匙体育馆开战 开幕式振奋人心
2014/07/19 DOTA
Python实现提取文章摘要的方法
2015/04/21 Python
浅析Python的Django框架中的Memcached
2015/07/23 Python
Python的Tornado框架的异步任务与AsyncHTTPClient
2016/06/27 Python
Python编程实现使用线性回归预测数据
2017/12/07 Python
python3.6+django2.0开发一套学员管理系统
2018/03/03 Python
对python sklearn one-hot编码详解
2018/07/10 Python
python根据多个文件名批量查找文件
2019/08/13 Python
Python3将jpg转为pdf文件的方法示例
2019/12/13 Python
初中学校军训方案
2014/05/09 职场文书
股票投资建议书
2014/05/19 职场文书
离婚协议书范文2015
2015/01/26 职场文书
2015年度物业公司工作总结
2015/04/27 职场文书
开学随笔
2015/08/15 职场文书
少年的你:世界上没有如果,要在第一次就勇敢的反抗
2019/11/20 职场文书
vue使用Google Recaptcha验证的实现示例
2021/08/23 Vue.js