您的位置：首页 > Web前端 > JavaScript

JS下拉列表交换数据，互相选择代码

2014-11-24 11:01 591 查看

<span style="font-size:24px;"><!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=utf-8" />
<title>下拉列表交换数据</title>
</head>
<body>
<table border=0 cellpadding=5 cellspacing=0 align=center>
<form action='' method=post name=myform>
<tr align=center><td> </td>
<td></td><td> </td>
<td></td></tr>
<tr align=center>
<td>
<select name='d_b1' id='d_b1' size=20 style='width:200px' ondblclick='Add()'>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</td>
<td><input type=button name=b1 value=' → ' onclick='Add()'><br><br><input type=button name=b1 value=' ← ' onclick='Del()'></td>
<td>
<select name='d_b2' id="d_b2" size=20 style='width:200px' ondblclick='Del()'>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</td>
<td> </td>
</tr>
<tr><td colspan=4 align=right></td></tr>
</form></table>
<script>
var x=document.getElementById('d_b1')
var y=document.getElementById('d_b2')
function Add(){
	 for(var i=0;x[i];i++){
		 x[i].selected==true&&y.appendChild(x[i])
			 }	}
function Del(){
	 for(var i=0;y[i];i++){
		y[i].selected==true&&x.appendChild(y[i])
			 }	}
</script>
</body>
</html></span>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航