今天写一个提交表单,有用到类似的功能。
写下来后,顺便记录下给大家。
复制内容到剪贴板
代码:
<html>
<head>
<title>选择订单</title>
<script type="text/javascript">
Array.prototype.strip=function() {
if(this.length<2) return [this[0]]||[];
var arr=[];
for(var i=0;i<this.length;i++) {
arr.push(this.splice(i--,1));
for(var j=0;j<this.length;j++) {
if(this[j]==arr[arr.length-1]) {
this.splice(j--,1);
}
}
}
return arr;
}
function go() {
var a = window.opener, b = document.getElementById('mysel'), c = "";
c = a.document.getElementById('workID').value=="" ? b.value : a.document.getElementById('workID').value+","+b.value;
var arr = c.split(",");
a.document.getElementById('workID').value = arr.strip();
window.close();
}
function add() {
var Q = document.getElementById('mysel');
var H = document.getElementsByName('workID');
Q.value = "";
for (var i=0; i<H.length; i++) {
var e = H[i];
if (e.checked == true) {
Q.value = Q.value + e.value + ",";
}
}
Q.value = Q.value.slice(0,-1);
}
function autoCheck(txt,chk) {
var ot=document.getElementById(txt);
var oc=document.getElementsByName(chk);
if (ot==null || oc==null) return;
var values=ot.value.split(",");
var oo={};
for (var i=0,c; c=oc[i]; i++) {
if (!oo[c.value]) oo[c.value]=i;
}
for (var i=0,v;v=values[i];i++) {
if(oo[v] || oo[v]==0) oc[oo[v]].checked=true;
}
}
var checkflag = true;
function check(field) {
var field = document.getElementsByName(field);
for (var i=0; i<field.length; i++)
field[i].checked = checkflag;
checkflag = !checkflag;
add();
return checkflag?"全选(S)":"取消(S)";
}
</script>
</head>
<body onload="autoCheck('mysel','workID')">
<table width="98%" align="center" border="0" cellspacing="1" cellpadding="4" bgcolor="#000000">
<tr height="25" align="center" bgcolor="#3399ff">
<td width="40"><strong>选择</strong></td>
<td><strong>订单号</strong></td>
</tr>
<tr height="25" align="left" bgcolor="#fff7dd">
<td width="40"><input type="checkbox" value="831" name="workID" onClick="add()"></td>
<td><a href="/order/order.php?AID=831">CCTV5PO0719</a></td>
</tr>
<tr height="25" align="left" bgcolor="#ffffff">
<td><input type="checkbox" value="830" name="workID" onClick="add()"></td>
<td><a href="/order/order.php?AID=830">CCTV5PO0718</a></td>
</tr>
<tr height="25" align="left" bgcolor="#fff7dd">
<td><input type="checkbox" value="828" name="workID" onClick="add()"></td>
<td><a href="/order/order.php?AID=828">CCTV5PO0716</a></td>
</tr>
<tr height="25" align="left" bgcolor="#ffffff">
<td><input type="checkbox" value="826" name="workID" onClick="add()"></td>
<td><a href="/order/order.php?AID=826">CCTV5PO0714</a></td>
</tr>
<tr height="25" align="left" bgcolor="#fff7dd">
<td><input type="checkbox" value="827" name="workID" onClick="add()"></td>
<td><a href="/order/order.php?AID=827">CCTV5PO0715</a></td>
</tr>
<tr height="25" align="left" bgcolor="#ffffff">
<td><input type="checkbox" value="820" name="workID" onClick="add()"></td>
<td><a href="/order/order.php?AID=820">CCTV5PO0708</a></td>
</tr>
<tr height="25" align="left" bgcolor="#fff7dd">
<td><input type="checkbox" value="821" name="workID" onClick="add()"></td>
<td><a href="/order/order.php?AID=821">CCTV5PO0709</a></td>
</tr>
<tr height="25" align="left" bgcolor="#ffffff">
<td><input type="checkbox" value="823" name="workID" onClick="add()"></td>
<td><a href="/order/order.php?AID=823">CCTV5PO0711</a></td>
</tr>
<tr height="25" align="left" bgcolor="#fff7dd">
<td><input type="checkbox" value="824" name="workID" onClick="add()"></td>
<td><a href="/order/order.php?AID=824">CCTV5PO0712</a></td>
</tr>
</table>
<input type="text" name="mysel" id="mysel" style="width:98%" value="" /><br />
<input type="button" name="sel_all" title="选择或取消全部" value="全选(S)" accesskey="S" onClick='this.value=check("workID")'> <input onclick="go();" type="button" value="添加(A)" accesskey="A">
<table cellspacing="0" cellpadding="0" align="center" style="font-size: 12px; font-family: Tahoma, Arial; margin-top:10px;" width="98%">
<tr style="font-size: 0px; line-height: 4px; spacing: 0px; padding: 0px; background-color: #333ccc;">
<td> </td>
</tr>
</table>
<br /><br />
</body></html>