<table width="200" border="1" name="atable">
<thead>
<tr>
<td> </td>
<td> </td>
</tr>
</thead>
<tbody name="content">
<tr>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
就像上面的图所示
一个TABLE,下面有两个按钮,选择数据后,点击左边的按钮就在左边的列点击右边的按钮,数据就进入右边的列
checkbox 选中后,就把选中的数据从下面,拿到上面去, 又分两个按钮, 左边的按钮添加到TABLE的左边的列, 右边的按钮添加到右边的列
下面选择数据,点击double cross ,数据添加到 上面两次交叉 那一列
点triple cross,数据添加到上面 三次交叉 那一列
2个框 2个按钮 一个向左 一个向右 点向左的按钮 选中的数据到左边的框里 点向右的按钮 选中的数据到右边的框里 是这样么?
<html><head><title> this is my test!</title></head><body><script language="JavaScript">function copyToList(from,to) //from表示:包含可选择项目的select对象名字 to表示:列出可选择项目的select对象名字//你可以根据你的具体情况修改{fromList = eval('document.forms[0].' + from);toList = eval('document.forms[0].' + to);if (toList.options.length > 0 && toList.options[0].value == 'temp'){ toList.options.length = 0;}var sel = false;for (i=0;i<fromList.options.length;i++){ var current = fromList.options[i]; if (current.selected) { sel = true; if (current.value == 'temp') { alert ('你不能选择这个项目!'); return; } txt = current.text; val = current.value; toList.options[toList.length] = new Option(txt,val); fromList.options[i] = null; i--; }}}function allSelect() //这是当用户按下提交按钮时,对列出选择的select对象执行全选工作,让递交至的后台程序能取得相关数据{List = document.forms[0].chosen;if (List.length && List.options[0].value == 'temp') return;for (i=0;i<List.length;i++){ List.options[i].selected = true;}}function copyAll(from,to){var fromList = eval('document.forms[0].' + from);var toList = eval('document.forms[0].' + to);if (toList.options.length > 0 && toList.options[0].value == 'temp'){ toList.options.length = 0;}for (i=0;i<fromList.options.length;i++){ var current = fromList.options[i]; toList.options[toList.length] = new Option(current.text,current.value); fromList.options[i] = null; i--;}}</script><table border="0"> <form onSubmit="allSelect()"> <tr> <td> <select name="possible" size="4"MULTIPLE width=200 style="width: 200px"> <option value="1">中国广州 <option value="2">中国上海 <option value="3">中国北京 <option value="4">中国武汉 </select> </td> <td><a href="javascript:copyToList('possible','chosen')">添加至右方--></a><br> <br> <a href="javascript:copyAll('possible','chosen')">添加All至右方--></a> <br><br> </a><a href="javascript:copyToList('chosen','possible')"><--添加至左方</a><br><br> </a><a href="javascript:copyAll('chosen','possible')"><--添加All至左方</a> <br></td> <td> <select name="chosen" size="4"MULTIPLE width=200 style="width: 200px;"> <option value="temp">从左边选择你的地区 </select> </td> </tr> </form> </table></body></html>