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 相关文章推荐
又一个小巧的图片预加载类
May 05 Javascript
Js 刷新框架页的代码
Apr 13 Javascript
js 获取屏幕各种宽高的方法(浏览器兼容)
May 15 Javascript
jquery中html、val与text三者属性取值的联系与区别介绍
Dec 29 Javascript
javascript中2个感叹号的用法实例详解
Sep 04 Javascript
深入分析原生JavaScript事件
Dec 29 Javascript
简单对比分析JavaScript中的apply,call与this的使用
Dec 04 Javascript
三种方式实现瀑布流布局
Feb 10 Javascript
jQuery插件echarts去掉垂直网格线用法示例
Mar 03 Javascript
bootstrap table单元格新增行并编辑
May 19 Javascript
Vue指令v-for遍历输出JavaScript数组及json对象的常见方式小结
Feb 11 Javascript
Node.js如何对SQLite的async/await封装详解
Feb 14 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不用正则采集速度探究总结
2008/03/24 PHP
PHP提取数据库内容中的图片地址并循环输出
2010/03/21 PHP
php 网上商城促销设计实例代码
2012/02/17 PHP
PHP curl 并发最佳实践代码分享
2012/09/05 PHP
PHP实现生成透明背景的PNG缩略图函数分享
2014/07/08 PHP
destoon首页调用求购供应信息的地区名称的方法
2014/08/21 PHP
php实现的任意进制互转类分享
2015/07/07 PHP
IE Firefox 使用自定义标签的区别
2009/10/15 Javascript
Jquery下:nth-child(an+b)的使用注意
2011/05/28 Javascript
jquery bind(click)传参让列表中每行绑定一个事件
2014/08/06 Javascript
Javascript获取当前日期的农历日期代码
2014/10/08 Javascript
JavaScript 学习笔记之语句
2015/01/14 Javascript
Javascript中3个需要注意的运算符
2015/04/02 Javascript
nodejs实现bigpipe异步加载页面方案
2016/01/26 NodeJs
NodeJS连接MongoDB数据库时报错的快速解决方法
2016/05/13 NodeJs
angular2 ng2-file-upload上传示例代码
2018/08/23 Javascript
vue中动态添加class类名的方法
2018/09/05 Javascript
NodeJs入门教程之定时器和队列
2019/03/08 NodeJs
Vue的Options用法说明
2020/08/14 Javascript
[47:43]完美世界DOTA2联赛PWL S3 Magama vs GXR 第二场 12.19
2020/12/24 DOTA
改进Django中的表单的简单方法
2015/07/17 Python
python遍历目录的方法小结
2016/04/28 Python
Windows下的Jupyter Notebook 安装与自定义启动(图文详解)
2018/02/21 Python
Django框架使用内置方法实现登录功能详解
2019/06/12 Python
Django admin禁用编辑链接和添加删除操作详解
2019/11/15 Python
浅谈pytorch torch.backends.cudnn设置作用
2020/02/20 Python
Html5原生拖拽相关事件简介以及基础实现
2020/11/19 HTML / CSS
日本一家专门经营各种箱包的大型网站:Traveler Store
2016/08/03 全球购物
加拿大便宜的隐形眼镜商店:Clearly
2016/09/15 全球购物
德国孕妇装和婴童服装网上商店:bellybutton
2018/04/12 全球购物
Puccini乌克兰:购买行李箱、女士手袋网上商店
2020/08/06 全球购物
临床医学大学生求职信
2013/09/28 职场文书
开学寄语大全
2014/04/08 职场文书
2014年国庆标语
2014/06/30 职场文书
部门经理迟到检讨书
2015/02/16 职场文书
辞职报告(范文三篇)
2019/08/27 职场文书