javascript 两个 select 内容之间传输-纯函数无需绑定
来源:互联网 发布:nginx怎么用 编辑:程序博客网 时间:2024/06/02 06:51
<HTML><HEAD> <TITLE>选择下拉菜单-www.51windows.Net</TITLE> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <META NAME="Description" CONTENT="Power by 51windows.Net"></HEAD><BODY><p>选定一项或多项然后点击添加或移除(按住shift或ctrl可以多选),或在选择项上双击进行添加和移除。</p><form method="post" name="myform"> <table border="0" width="300"> <tr> <td width="40%"> <select style="width:100%;" multiple name="list1" size="12" ondblclick="moveOption(true,document.myform.list1, document.myform.list2,document.myform.city)"> <option value="北京">北京</option> <option value="上海">上海</option> <option value="山东">山东</option> <option value="安徽">安徽</option> <option value="重庆">重庆</option> <option value="福建">福建</option> <option value="甘肃">甘肃</option> <option value="广东">广东</option> <option value="广西">广西</option> <option value="贵州">贵州</option> <option value="海南">海南</option> <option value="河北">河北</option> <option value="黑龙江">黑龙江</option> <option value="河南">河南</option> <option value="湖北">湖北</option> <option value="湖南">湖南</option> <option value="内蒙古">内蒙古</option> <option value="江苏">江苏</option> <option value="江西">江西</option> <option value="吉林">吉林</option> <option value="辽宁">辽宁</option> <option value="宁夏">宁夏</option> <option value="青海">青海</option> <option value="山西">山西</option> <option value="陕西">陕西</option> <option value="四川">四川</option> <option value="天津">天津</option> <option value="西藏">西藏</option> <option value="新疆">新疆</option> <option value="云南">云南</option> <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(true,document.myform.list1, document.myform.list2,document.myform.city)"><br><br> <input type="button" value="全选" onclick="moveAllOption(true,document.myform.list1, document.myform.list2,document.myform.city)"><br><br> <input type="button" value="删除" onclick="moveOption(false,document.myform.list2, document.myform.list1,document.myform.city)"><br><br> <input type="button" value="全删" onclick="moveAllOption(false,document.myform.list2, document.myform.list1,document.myform.city)"> </td> <td width="40%"> <select style="width:100%;" multiple name="list2" size="12" ondblclick="moveOption(false,document.myform.list2, document.myform.list1,document.myform.city)"> </select> </td> </tr> </table> 值:<input type="text" name="city" size="40" value="" /> <hr> <table border="0" width="300"> <tr> <td width="40%"> <select style="width:100%;" multiple name="list11" size="12" ondblclick="moveOption(true,document.myform.list11, document.myform.list12,document.myform.city1)"> <option value="北京">北京</option> <option value="上海">上海</option> <option value="山东">山东</option> <option value="安徽">安徽</option> <option value="重庆">重庆</option> <option value="福建">福建</option> <option value="甘肃">甘肃</option> <option value="广东">广东</option> <option value="广西">广西</option> <option value="贵州">贵州</option> <option value="海南">海南</option> <option value="河北">河北</option> <option value="黑龙江">黑龙江</option> <option value="河南">河南</option> <option value="湖北">湖北</option> <option value="湖南">湖南</option> <option value="内蒙古">内蒙古</option> <option value="江苏">江苏</option> <option value="江西">江西</option> <option value="吉林">吉林</option> <option value="辽宁">辽宁</option> <option value="宁夏">宁夏</option> <option value="青海">青海</option> <option value="山西">山西</option> <option value="陕西">陕西</option> <option value="四川">四川</option> <option value="天津">天津</option> <option value="西藏">西藏</option> <option value="新疆">新疆</option> <option value="云南">云南</option> <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(true,document.myform.list11, document.myform.list12,document.myform.city1)"><br><br> <input type="button" value="全选" onclick="moveAllOption(true,document.myform.list11, document.myform.list12,document.myform.city1)"><br><br> <input type="button" value="删除" onclick="moveOption(false,document.myform.list12, document.myform.list11,document.myform.city1)"><br><br> <input type="button" value="全删" onclick="moveAllOption(false,document.myform.list12, document.myform.list11,document.myform.city1)"> </td> <td width="40%"> <select style="width:100%;" multiple name="list12" size="12" ondblclick="moveOption(false,document.myform.list12, document.myform.list11,document.myform.city)"> </select> </td> </tr> </table> 值:<input type="text" name="city1" size="40" value="" /></form><script language="JavaScript"> <!-- /** * * @param isAdd 是否是添加,添加的话就取 t 里面的值,如果是移除就取 f 里面的值 * @param f * @param t * @param v */ function moveOption(isAdd, f, t, v){ try{ for(var i = 0; i < f.options.length; i++){ if(f.options[i].selected){ var e = f.options[i]; t.options.add(new Option(e.text, e.value)); f.remove(i); i = i - 1; } } if(isAdd) { v.value=getvalue(t); } else { v.value=getvalue(f); } } catch(e){} } function getvalue(geto){ var allvalue = ""; for(var i = 0; i < geto.options.length; i++){ allvalue += geto.options[i].value + ","; } return allvalue; } /** * * @param isAdd 是否是添加,添加的话就取 t 里面的值,如果是移除就取 f 里面的值 * @param f * @param t * @param v */ function moveAllOption(isAdd, f, t, v){ try{ for(var i = 0;i < f.options.length; i++){ var e = f.options[i]; t.options.add(new Option(e.text, e.value)); f.remove(i); i = i - 1; } if(isAdd) { v.value=getvalue(t); } else { v.value=getvalue(f); } } catch(e){} } //--></script></BODY></HTML>
0 0
- javascript 两个 select 内容之间传输-纯函数无需绑定
- 两个 select 之间内容互相的传输
- javascript实现两个select选择框内容动态绑定
- javascript两个select控件内容互相移动
- 两个javascript之间函数的调用
- HTML一个form表单中有两个(多个)submit,后台如何区分(纯HTML实现,无需javascript)
- HTML一个form表单中有两个(多个)submit,后台如何区分(纯HTML实现,无需javascript)
- JavaScript 中的“纯函数”
- JavaScript中的纯函数
- 纯javascript模块加载 无需第三方加载器
- 两个纯html之间的传值
- 两个纯Html之间的传值
- 两个apk之间对应传输数据
- 在两个ViewController之间传输数据
- JavaScript函数绑定
- javascript函数绑定
- javascript中的函数绑定
- JavaScript函数绑定
- uva 10917 Walk Through the Forest
- shell script 自动化测试框架 - shUnit2
- 老人的段子情缘
- OpenCV学习笔记【2】:第二个程序--播放AVI视频
- Java io字符写入 下载网络文件 获取url文件
- javascript 两个 select 内容之间传输-纯函数无需绑定
- HDU 2176 尼姆博弈
- 修改domino邮箱归属用户
- 技术不牛如何才拿到国内IT巨头的Offer
- 4G浏览器 随机遇而生
- VPN/GOOGLE/google play
- 1269-Intersecting Lines
- Linux(AT91SAM9260)增加UBIFS文件系统支持
- google+登录API