js select 实现左右传值.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Untitled Document</title>
<script language="javascript">
function addItem(objForm)
{
var valueAry=new Array();
var textAry=new Array();
var leftElement=objForm.elements["left"];
var rightElement=objForm.elements["right"];
var count=0;
var i,j,k,flag;
for(i=0;i<leftElement.options.length;i++)
{
if(leftElement.options[i].selected)
{valueAry[count]=leftElement.options[i].value;
textAry[count]=leftElement.options[i].text;
count++;
}
}
var count1=rightElement.options.length;
count1=count1>0?count1:0;
for(j=0;j<count;j++)
{
flag=false;
for(k=0;k<count1;k++)
{
if(rightElement.options[k].text==textAry[j])
flag=true;
}
if(!flag)
{
rightElement.options[count1]=new Option(textAry[j],valueAry[j]);
count1++;
}
}
}
function subItem(objForm)
{
var i;
var objElement=objForm.elements["right"];
for(i=objElement.options.length-1;i>=0;i--)
{
if(objElement.options[i].selected)
objElement.options[i]=null;
}
}
function addAllItem(objForm)
{
var i;
var leftElement=objForm.elements["left"];
for(i=0;i<leftElement.options.length;i++)
{
leftElement.options[i].selected=true;
}
addItem(objForm);
}
function subAllItem(objForm)
{
var i;
var rightElement=objForm.elements["right"];
for(i=0;i<rightElement.options.length;i++)
rightElement.options[i].selected=true;
subItem(objForm);
}
</script>
</head>
<body>
<table width="200" cellpadding="0" cellspacing="0" border="0">
<form>
<tr>
<td width="80" rowspan="4">
<select name="left" style="width:80px;height:100px;" multiple>
<option>ITEM1</option>
<option>ITEM2</option>
<option>ITEM3</option>
<option>ITEM4</option>
<option>ITEM5</option>
<option>ITEM6</option>
</select></td>
<td width="40" height="20" align="center">
<input type="button" value=" >> " onclick="addItem(this.form);">
</td>
<td width="80" rowspan="4" align="right">
<select name="right" style="width:80px;height:100px;" multiple>
</select>
</td>
</tr>
<tr>
<td width="40" align="center"><input type="button" value=" << " onclick="subItem(this.form)"></td>
</tr>
<tr>
<td width="40" align="center"><input type="button" value="ALL>>" onclick="addAllItem(this.form)"></td>
</tr>
<tr>
<td width="40" align="center"><input type="button" value="<<ALL" onclick="subAllItem(this.form)"></td>
</tr>
</form>
</tr>
</table>
</body>
</html>
js select 实现左右传值.html的更多相关文章
- js select级联,上面分类,下面是内容
js select级联,上面分类,下面是内容. js级联效果如下: 分类: 请选择 水果 蔬菜 其他 内容: // html和js代码如下: <html> <hea ...
- select 选择列表传值问题
<select> <option value ="volvo">Volvo</option> <option value ="s ...
- JS Select 月日日期联动
Js对Select控件进行联动操作,一个select选择月份后另一个select生成对应月份的所有日期. <%@ Page Language="C#" AutoEventWi ...
- jsp js action之间的传值
1.struts2 action如何向JSP的JS函数传值 action中定义变量public class TestAction extends ActionSupport implements Se ...
- UIWebView的应用和其中的JS与OC间传值
现在有很多的应用已经采用了WebView和html语言结合的开发模式.html5一直很火因为一份代码可以在多个平台上运用啊,效果各不相同都很美观,也越来越有一些公司直接招后台程序员和html5程序员, ...
- 一个简单js select插件
现在,通过一个select插件,来介绍一下js插件的构建过程. 1.先上效果图 2.目录构建 (1)这个select插件,我给它起名交hongselect,所以呢,首先建个hongselect的文件夹 ...
- js控制父子页面传值(iframe和window.open)
在html中,window对象代表浏览器中一个打开的窗口,就像我们C/S中做窗体一样,在该页的window对象就是new了一个新的窗体对象. 就像做C/S开发一样,浏览器是一个软件,每一个网页都是它n ...
- angular js $post,$get请求传值
困扰了我好几天的问题!!! 刚开始学play框架,在向后台传值时,一直不成功! 当你用$POST传递一个参数时: HTML: <button ng-click=test()>测试</ ...
- JQuery/JS select标签动态设置选中值、设置禁止选择 button按钮禁止点击 select获取选中值
//**1.设置选中值:(根据索引确定选中值)**// var osel=document.getElementById("selID"); //得到select的ID var o ...
随机推荐
- South入门教程
对于django自带的syncdb同步models和数据库的缺陷,所以我选择第三方的工具South. 1.安装South:pip install South 2.South设置: 把 south 加到 ...
- Tornado 的教材
Tornado 的教材 作者:杨昆链接:https://www.zhihu.com/question/19707966/answer/12731684来源:知乎著作权归作者所有,转载请联系作者获得授权 ...
- ASP.NET 安全认证
一. 新建一个测试项目 新建一个测试项目,包含三张页面(Default.aspx.Login.aspx.UserInfo.aspx). 二. 修改 Web.config 1.把<authen ...
- Unity3D移植Windows Universal App(Windows 8.1 及Windows Phone 8.1)版本遇到的坑
移植的情况以及遇到的问题: 1.选用的版本是最新的Unity5.0. 2.全屏播放视频Handheld.PlayFullScreenMoview的路径必须是全路径,并且前面要加上"ms-ap ...
- GNU project C
gcc - GNU project C and C++ compiler gcc [option] file... preprocessing compila ...
- Node.js全局对象
Node.js的全局对象是具有全局性的,它们可在所有的模块中应用.我们并不需要包括这些对象在应用中,而可以直接使用它们.这些对象的模块,函数,字符串和对象本身,如下所述. __filename __f ...
- codeforces D. Long Path
http://codeforces.com/contest/408/problem/D 题意:有一排房间每个房间有两扇门,一扇通往第i+1个房间,另一扇通往第p[i]个房间,(p[i]<=i)然 ...
- Election Time
Election Time Time Limit: 1000MS Memory limit: 65536K 题目描述 The cows are having their first election ...
- Qt学习 之 Socket通信(世界上最简单的例子了)
最近写大作业用到Qt的Socket部分,网上关于这部分的资料都太过复杂,现在总结一下一些简单的应用.有机会可以给大家讲讲用Socket传送文件的代码. 这里主要讲解如何实现TCP和UDP的简单通信. ...
- 1.Repeater控件
在用到数据库数据并且要逐条显示时,就需要用到repeater\listview等这样的数据库控件进行动态的显示数据. Repeater相当于foreach的功能,用于对绑定数据源中的数据进行遍历显示, ...