Table之间的传数据很少见，通常是用两个Select来左右传数据。把你TableA和TableB的数据贴上来看看
解决方案 »
- 如何使textarea 显示行号
- Jquery 在ie上动画不显示。
- createPopup：问题，createPopup创建的层不能使用INPUT，<a也无效，请问如何解决。
- 如何实现划词取字或者光标停留取字?
- 想用ASP或JS生成与PHP中的MD5函数结果一致的校验码，如何实现？
- 使用new ActiveXObject("Excel.Application")方法将表格中数据导出到Excel时表格中的字符串值“0001”在excel中变成了1
- 覆写onchange事件
- 高分求正则表达例子，分不够再加。。。。要求如下。
- 怎样判断一个列表框是否有选项啊？急
- ----为什么值总是为空(javascript)----
- 请问有没有办法让弹出窗口每天只弹出一次？
- 100分请教坛中大侠们
function set()
{
var A=document.getElementById('A');
var B=document.getElementById('B');
//将A的数据插入到B的后边
B.childNodes[0].insertBefore(A.childNodes[0].cloneNode(true));
}
</script><table id='A'><tr>
<td>tableA</td></tr></table><input type=button value='转移数据' onclick='set()'>
<table id='B'><tr>
<td>tableB</td></tr></table>
<script LANGUAGE="JavaScript">var singleSelect = true; // Allows an item to be selected once only
var sortSelect = true; // Only effective if above flag set to true
var sortPick = true; // Will order the picklist in sort sequence// Initialise - invoked on load
function initIt() {
var selectList = document.getElementById("SelectList");
var selectOptions = selectList.options;
var selectIndex = selectList.selectedIndex;
var pickList = document.getElementById("PickList");
var pickOptions = pickList.options;
pickOptions[0] = null; // Remove initial entry from picklist (was only used to set default width)
if (!(selectIndex > -1)) {
selectOptions[0].selected = true; // Set first selected on load
selectOptions[0].defaultSelected = true; // In case of reset/reload
}
selectList.focus(); // Set focus on the selectlist
}// Adds a selected item into the picklist
function addIt() {
var selectList = document.getElementById("SelectList");
var selectIndex = selectList.selectedIndex;
var selectOptions = selectList.options;
var pickList = document.getElementById("PickList");
var pickOptions = pickList.options;
var pickOLength = pickOptions.length;
// An item must be selected
while (selectIndex > -1) {
pickOptions[pickOLength] = new Option(selectList[selectIndex].text);
pickOptions[pickOLength].value = selectList[selectIndex].value;
// If single selection, remove the item from the select list
if (singleSelect) {
selectOptions[selectIndex] = null;
}
if (sortPick) {
var tempText;
var tempValue;
// Sort the pick list
while (pickOLength > 0 && pickOptions[pickOLength].value < pickOptions[pickOLength-1].value) {
tempText = pickOptions[pickOLength-1].text;
tempValue = pickOptions[pickOLength-1].value;
pickOptions[pickOLength-1].text = pickOptions[pickOLength].text;
pickOptions[pickOLength-1].value = pickOptions[pickOLength].value;
pickOptions[pickOLength].text = tempText;
pickOptions[pickOLength].value = tempValue;
pickOLength = pickOLength - 1;
}
}
selectIndex = selectList.selectedIndex;
pickOLength = pickOptions.length;
}
selectOptions[0].selected = true;
}// Deletes an item from the picklist
function delIt() {
var selectList = document.getElementById("SelectList");
var selectOptions = selectList.options;
var selectOLength = selectOptions.length;
var pickList = document.getElementById("PickList");
var pickIndex = pickList.selectedIndex;
var pickOptions = pickList.options;
while (pickIndex > -1) {
// If single selection, replace the item in the select list
if (singleSelect) {
selectOptions[selectOLength] = new Option(pickList[pickIndex].text);
selectOptions[selectOLength].value = pickList[pickIndex].value;
}
pickOptions[pickIndex] = null;
if (singleSelect && sortSelect) {
var tempText;
var tempValue;
// Re-sort the select list
while (selectOLength > 0 && selectOptions[selectOLength].value < selectOptions[selectOLength-1].value) {
tempText = selectOptions[selectOLength-1].text;
tempValue = selectOptions[selectOLength-1].value;
selectOptions[selectOLength-1].text = selectOptions[selectOLength].text;
selectOptions[selectOLength-1].value = selectOptions[selectOLength].value;
selectOptions[selectOLength].text = tempText;
selectOptions[selectOLength].value = tempValue;
selectOLength = selectOLength - 1;
}
}
pickIndex = pickList.selectedIndex;
selectOLength = selectOptions.length;
}
}// Selection - invoked on submit
function selIt(btn) {
var pickList = document.getElementById("PickList");
var pickOptions = pickList.options;
var pickOLength = pickOptions.length;
if (pickOLength < 1) {
alert("No Selections in the Picklist\nPlease Select using the [->] button");
return false;
}
for (var i = 0; i < pickOLength; i++) {
pickOptions[i].selected = true;
}
return true;
}//-->
</SCRIPT>
<!-- ////// ////// -->
<form NAME="theform" ID="theform" ACTION="whatever" onSubmit="return selIt();">
<table>
<tr>
<td>
<select NAME="SelectList" ID="SelectList" SIZE="5" multiple="multiple" style="width: 150px">
<option VALUE="01sel">Selection 01</option>
<option VALUE="02sel">Selection 02</option><option VALUE="03sel">Selection 03</option>
<option VALUE="04sel">Selection 04</option>
<option VALUE="05sel">Selection 05</option>
<option VALUE="06sel">Selection 06</option>
<option VALUE="07sel">Selection 07</option>
<option VALUE="08sel">Selection 08</option>
<option VALUE="09sel">Selection 09</option>
<option VALUE="10sel">Selection 10</option>
</select></td>
<td>
<input TYPE="BUTTON" VALUE="->" ONCLICK="addIt();"></input>
<br>
<input TYPE="BUTTON" VALUE="<-" ONCLICK="delIt();"></input>
</td>
<td>
<select NAME="PickList" ID="PickList" SIZE="5" multiple="multiple" style="width: 150px">
<option VALUE="01sel">Selection 01</option>
</select>
</td>
</tr>
<tr>
<td ALIGN="left">
<input TYPE="reset" VALUE="Reset" ONCLICK="javascript: window.location.href = 'picklist.html'">
</td><td>
</td>
<td ALIGN="right">
<input TYPE="submit" VALUE="Submit">
</td>
</tr>
</table>
</form>
<script type="text/javascript">function move(fbox, tbox) {
var arrFbox = new Array();
var arrTbox = new Array();
var arrLookup = new Array();
var i;
for(i=0; i<tbox.options.length; i++) {
arrLookup[tbox.options[i].text] = tbox.options[i].value;
arrTbox[i] = tbox.options[i].text;
}
var fLength = 0;
var tLength = arrTbox.length
for(i=0; i<fbox.options.length; i++) {
arrLookup[fbox.options[i].text] = fbox.options[i].value;
if(fbox.options[i].selected && fbox.options[i].value != "") {
arrTbox[tLength] = fbox.options[i].text;
tLength++;
} else {
arrFbox[fLength] = fbox.options[i].text;
fLength++;
}
}
arrFbox.sort();
arrTbox.sort();
fbox.focus();
fbox.length = 0;
tbox.length = 0;
var c;
for(c=0; c<arrFbox.length; c++) {
var no = new Option();
no.value = arrLookup[arrFbox[c]];
no.text = arrFbox[c];
fbox[c] = no;
}
for(c=0; c<arrTbox.length; c++) {
var no = new Option();
no.value = arrLookup[arrTbox[c]];
no.text = arrTbox[c];
tbox[c] = no;
}
}function selectAll(box) {
for(var i=0; i<box.length; i++) {
box[i].selected = true;
}
}
</script>
<form method="post" name="combo_box">
<table cellpadding="4" cellspacing="0" border="0">
<tr>
<td>
<select multiple size="10" name="list1" style="width:150" onDblClick="move(document.combo_box.list1,document.combo_box.list2)">
<option value="12">Alabama</option>
<option value="54">Alaska</option>
<option value="65">Arizona</option>
<option value="45">Arkansas</option>
<option value="2">California</option>
<option value="6">Colorado</option>
<option value="81">Connecticut</option>
<option value="5">Delaware</option>
</select>
</td>
<td align="center" valign="middle">
<input type="button" onClick="move(this.form.list2,this.form.list1)" value="<<" id=button1 name=button1>
<input type="button" onClick="move(this.form.list1,this.form.list2)" value=">>" id=button2 name=button2>
</td>
<td>
<select multiple size="10" name="list2" style="width:150" onDblClick="move(document.combo_box.list2,document.combo_box.list1)">
</select>
</td>
</tr>
<tr><td align="center" colspan="3"><input type="submit" name="submit_button" value="Submit" onClick="selectAll(document.combo_box.list2);"></td></tr>
</table>
</form>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>made by meixx</title>
<script language="javascript">
<!--
function Add(ObjSource,ObjTarget){
for(var i=0;i<ObjSource.length;i++){
if(ObjSource.options[i].selected){
var opt=document.createElement("OPTION");
ObjTarget.add(opt);
opt.value=ObjSource.options[i].value;
opt.text=ObjSource.options[i].text;
ObjSource.options.removeChild(ObjSource.options[i--]);
opt.selected=true;
}
}
}
function AddAll(ObjSource,ObjTarget){
SelectAll(ObjSource);
Add(ObjSource,ObjTarget);
}
function SelectAll(ObjSource){
for(var i=0;i<ObjSource.length;i++){
ObjSource.options[i].selected=true;
}
}function doSubmit(){
SelectAll(frmDisplay.dltTarget);
//frmDisplay.action="";//设置form 提交的action
alert(frmDisplay.action);
//frmDisplay.submit();//取消注释即可,提交上去的options
}
//->
</script>
</head><body>
<table width="350" border="1" style="border-collapse:collapse " bordercolor="#111111" cellpadding="0" cellspacing="0">
<tr>
<td width="150">
<select name="dltSource" size="10" multiple style="width:100% ">
<option value="0">辽宁</option>
<option value="0">黑龙江</option>
<option value="0">吉林</option>
<option value="0">河北</option>
<option value="0">河南</option>
<option value="0">江苏</option>
<option value="0">浙江</option>
<option value="0">海南</option>
<option value="0">福建</option>
<option value="0">山东</option>
<option value="0">青海</option>
<option value="0">宁夏</option>
<option value="0">内蒙古</option>
<option value="0">新疆</option>
<option value="0">陕西</option>
</select>
</td>
<td width="50" valign="middle">
<p style="width:100%" align="center"><input type="button" value="->" onClick="Add(document.all.dltSource,frmDisplay.dltTarget)" title="添加"></p>
<p style="width:100%" align="center"><input type="button" value="=>" onClick="AddAll(document.all.dltSource,frmDisplay.dltTarget)" title="添加全部"></p>
<p style="width:100%" align="center"><input type="button" value="<-" onClick="Add(frmDisplay.dltTarget,document.all.dltSource)" title="删除"></p>
<p style="width:100%" align="center"><input type="button" value="<=" onClick="AddAll(frmDisplay.dltTarget,document.all.dltSource)" title="删除全部"></p>
</td>
<td width="150">
<form id="frmDisplay" action="xxx.jsp" method="post" style="margin:0 ">
<select name="dltTarget" size="10" multiple style="width:100% "></select>
</form>
</td>
</tr>
<tr>
<td align="center">作者:梅雪香</td>
<td align="center">ver:1.0</td>
<td align="center">
<input type="reset" onClick="javascript:window.location.reload();" value="重置">
<input type="button" value="提交" onClick="doSubmit()">
</td>
</tr>
</table></body>
</html>
#orderList.js/**********************************************************************
orderList.js
Code by Sunfic Wang, Hisenit.com. 2004-12-18
-----------------------------------------------------------------------
叶面加载时需要在做如下调用
<body onload="onListDirect(document.forms[0],0)">
**********************************************************************/
function onListDirect(objF,mode){ var tmpValue="";
var tmpText="";
var intIndex=0;
var objList1=objF.orderList1;
var objList2=objF.orderList2;
//var isRepeat=false;
switch (mode){
case 1: //添加一个新元素
intIndex=objList1.selectedIndex;
if (intIndex==-1) return;
/*
for(i=0;i<objList2.length;i++){
if (objList2.options[i].value==objList1.options[intIndex].value){
isRepeat=true;break;}
}
if (!isRepeat || isRepeat && confirm("您选择了一个重复的元素，是否确定要再加入一次？")) {
objList2.add( new Option(tmpText=objList1.options[intIndex].text,tmValue=objList1.options[intIndex].value));
objList1.remove(intIndex;}
*/
objList2.add( new Option(objList1.options[intIndex].text,objList1.options[intIndex].value));
objList1.remove(intIndex);
if (intIndex==objList1.length) intIndex=0;
if (objList1.length!=0) objList1.options[intIndex].selected=true;
break;
case 2: //删除一个新元素
intIndex=objList2.selectedIndex;
if (intIndex==-1) return;
objList1.add( new Option(objList2.options[intIndex].text,objList2.options[intIndex].value));
objList2.remove(intIndex);
if (intIndex==objList2.length) intIndex=0;
if (objList2.length!=0) objList2.options[intIndex].selected=true;
break;
case 3: //添加所有元素
//objList2.length=0;
intIndex=objList1.length;
for(i=0;i<intIndex;i++){
objList2.add( new Option(objList1.options[0].text,objList1.options[0].value));
objList1.remove(0);}
break;
case 4: //删除所有元素
//for(i=objList2.length-1;i>=0;i--){
// objList2.remove(i);}
//objList2.length=0;
intIndex=objList2.length;
for(i=0;i<intIndex;i++){
objList1.add( new Option(objList2.options[0].text,objList2.options[0].value));
objList2.remove(0);}
break;
case 5: //上移元素
intIndex=objList2.selectedIndex;
if (objList2.selectedIndex<1) return;
tmpValue=objList2.options[objList2.selectedIndex-1].value;
tmpText=objList2.options[objList2.selectedIndex-1].text;
objList2.options[intIndex-1].value=objList2.options[objList2.selectedIndex].value;
objList2.options[intIndex-1].text=objList2.options[objList2.selectedIndex].text;
objList2.options[intIndex].value=tmpValue;
objList2.options[intIndex].text=tmpText;
objList2.options[intIndex-1].selected=true;
break; case 6: //下移元素
intIndex=objList2.selectedIndex;
if (intIndex<0) return;
if (intIndex==objList2.length-1) return;
tmpValue=objList2.options[intIndex+1].value;
tmpText=objList2.options[intIndex+1].text;
objList2.options[intIndex+1].value=objList2.options[intIndex].value;
objList2.options[intIndex+1].text=objList2.options[intIndex].text;
objList2.options[intIndex].value=tmpValue;
objList2.options[intIndex].text=tmpText;
objList2.options[intIndex+1].selected=true;
break;
case 0: //初始化列表
for(i=0;i<objList2.length;i++){
for(j=0;j<objList1.length;j++){
if (objList1.options[j].value==objList2.options[i].value){
objList1.remove(j);
break;}
}
} }
//判断按钮有效性
objF.addOne.disabled = (objList1.selectedIndex==-1)?true:false;
objF.delOne.disabled = (objList2.selectedIndex==-1)?true:false;
objF.addAll.disabled = (objList1.length==0)?true:false;
objF.delAll.disabled = (objList2.length==0)?true:false;
objF.moveUp.disabled = (objList2.selectedIndex<1)?true:false;
objF.moveDn.disabled = (objList2.selectedIndex==objList2.length-1 || objList2.selectedIndex==-1)?true:false;
}xxx.html<script language='javascript' src='../function/js/orderList.js'></script><body onload="onListDirect(document.forms[0],0)">
<form>
<table border='0' cellpadding='4' cellspacing='0' >
<tr>
<td>
可用的表头列表：<br>
<select name='orderList1' size='12' class='order' onDblClick="onListDirect(this.form,1)" onclick="onListDirect(this.form,7)">
<%=xml_nodes_option(xmlPath,"reports/reportList","id","title","","","","1")%>
</select>
</td>
<td>
<br>
<input type='button' class='btnOrder' style='font-family:Wingdings 3;font-size:16px;font-weight:bolder;' value='4' title="添加选中信息" onclick="onListDirect(this.form,1)" disabled name='addOne'><br><br>
<input type='button' class='btnOrder' style='font-family:Wingdings 3;font-size:16px;font-weight:bolder;' value='3' title="删除选中信息" onclick="onListDirect(this.form,2)" disabled name='delOne'><br><br>
<input type='button' class='btnOrder' style='font-family:Wingdings 3;font-size:16px;font-weight:bolder;' value='I' title="添加全部信息" onclick="onListDirect(this.form,3)" disabled name='addAll'><br><br>
<input type='button' class='btnOrder' style='font-family:Wingdings 3;font-size:16px;font-weight:bolder;' value='H' title="删除全部信息" onclick="onListDirect(this.form,4)" disabled name='delAll'>
</td>
<td>
当前的表头定义：<br>
<select name='orderList2' size='12' class='order' onDblClick="onListDirect(this.form,2)" onclick="onListDirect(this.form,7)">
<%=xml_nodes_option(xmlPath,"reports/report[@id='" & ID & "']","id","title","","","","1")%>
</select>
</td>
<td align='left' valign='bottom'>
<input type='button' class='btnOrder' style='font-family:Wingdings 3;font-size:16px;font-weight:bolder;' value='=' title="向上移动" onclick="onListDirect(this.form,5)" disabled name='moveUp'><br><br>
<input type='button' class='btnOrder' style='font-family:Wingdings 3;font-size:16px;font-weight:bolder;' value='?' title="向下移动" onclick="onListDirect(this.form,6)" disabled name='moveDn'><br><br>
<br><br><br><br>
</td>
</tr>
</table></form>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>made by meixx</title>
<style type="css/text">
body{font-size:10pt}
</style>
<script language="javascript">
<!--
var curRowSource=null;
var curRowTarget=null;
function selectRow(obj){
if(curRowSource){
curRowSource.style.backgroundColor="#FFFFFF";
curRowSource.style.color="#000000";
}
obj.style.backgroundColor="#3366FF";
obj.style.color="#FFFFFF";
curRowSource=obj;
var btns=document.getElementsByName("btn");
btns[0].disabled=false;
}
function selectRow1(obj){
if(curRowTarget){
curRowTarget.style.backgroundColor="#FFFFFF";
curRowTarget.style.color="#000000";
}
obj.style.backgroundColor="#3366FF";
obj.style.color="#FFFFFF";
curRowTarget=obj;
var btns=document.getElementsByName("btn");
btns[2].disabled=false;
}
function Add(tbSou,tbTar){
var rowSou=null;
var newRow=tbTar.insertRow();
if(tbSou.id=="tbSource"){
rowSou=curRowSource;
newRow.attachEvent("onclick",function(){selectRow1(newRow);});
}
else{
rowSou=curRowTarget;
newRow.attachEvent("onclick",function(){selectRow(newRow);});
}
for(var i=0;i<rowSou.cells.length;i++){
var newCell=newRow.insertCell();
newCell.innerHTML=rowSou.cells[i].innerHTML;
}
tbSou.deleteRow(rowSou.rowIndex);
var btns=document.getElementsByName("btn");
btns[0].disabled=true;
btns[2].disabled=true;
}function AddAll(tbSource,tbTarget){
for(var i=1;;i++){
if(tbSource.rows.length==1) return;
tbSource.rows[1].click();
Add(tbSource,tbTarget);
}
}
function doSubmit(){
SelectAll(frmDisplay.dltTarget);
//frmDisplay.action="";//设置form 提交的action
alert(frmDisplay.action);
//frmDisplay.submit();//取消注释即可,提交上去的options
}
//->
</script>
</head><body>
<table width="550" border="1" style="border-collapse:collapse " bordercolor="#111111" cellpadding="0" cellspacing="0">
<tr>
<td width="250" valign="top">
<table id="tbSource" cellpadding="0" cellspacing="0" border="1" style="border-collapse:collapse;cursor:default" bordercolor="#CCFFFF" width="100%">
<tr>
<td align="center" width="25%">姓名</td><td align="center" width="25%">性别</td><td align="center" width="25%">年龄</td><td align="center" width="25%">身高</td>
</tr>
<tr onclick="selectRow(this)">
<td>冯程程</td><td>女</td><td>22</td><td>167</td>
</tr>
<tr onclick="selectRow(this)">
<td>任盈盈</td><td>女</td><td>19</td><td>168</td>
</tr>
<tr onclick="selectRow(this)">
<td>杨玉环</td><td>女</td><td>18</td><td>162</td>
</tr>
<tr onclick="selectRow(this)">
<td>赢政</td><td>男</td><td>45</td><td>182</td>
</tr>
<tr onclick="selectRow(this)">
<td>项少龙</td><td>男</td><td>28</td><td>176</td>
</tr>
</table>
</td>
<td width="50" valign="middle">
<br>
<p style="width:100%" align="center"><input name="btn" type="button" value="->" onClick="Add(document.all.tbSource,tbTarget)" title="添加" disabled></p>
<p style="width:100%" align="center"><input name="btn" type="button" value="=>" onClick="AddAll(document.all.tbSource,tbTarget)" title="添加全部"></p>
<p style="width:100%" align="center"><input name="btn" type="button" value="<-" onClick="Add(tbTarget,document.all.tbSource)" title="删除" disabled></p>
<p style="width:100%" align="center"><input name="btn" type="button" value="<=" onClick="AddAll(tbTarget,document.all.tbSource)" title="删除全部"></p>
<br>
</td>
<td width="250" valign="top">
<form id="frmDisplay" action="xxx.jsp" method="post" style="margin:0 ">
<table id="tbTarget" cellpadding="0" cellspacing="0" border="1" style="border-collapse:collapse" bordercolor="#CCFFFF" width="100%">
<tr>
<td align="center" width="25%">姓名</td><td align="center" width="25%">性别</td><td align="center" width="25%">年龄</td><td align="center" width="25%">身高</td>
</tr>
</table>
</form>
</td>
</tr>
<tr>
<td align="center">作者:梅雪香</td>
<td align="center">ver:1.0</td>
<td align="center">
<input type="reset" onClick="javascript:window.location.reload();" value="重置">
<input type="button" value="提交" onClick="doSubmit()">
</td>
</tr>
</table></body>
</html>
</html>