日期:2014-05-16  浏览次数:20575 次

js动态绑定事件并传参数的方法整理

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
?<HEAD>
? <TITLE> New Document </TITLE>
? <META NAME="Generator" CONTENT="EditPlus">
? <META NAME="Author" CONTENT="">
? <META NAME="Keywords" CONTENT="">
? <META NAME="Description" CONTENT="">
?<style type="text/css">
table {
?border: 1px solid #9999cc;
?color: red;
}
td {
?font-family:Arial, Helvetica, sans-serif, 宋体;
?font-size: 12px;
?color: red;
?cursor:default;
}
input.readonly {
?padding-right: 1px;
?padding-left: 1px;
?padding-bottom: 2px;
?padding-top: 2px;
?border: 1px solid #9999cc;
?background: #efefef;
}
.textinput {
?border: 1px solid #9999cc;
?background:#FFFFCC;
?line-height: 16px;
?font-size: 12px;
}
?</style>
?</HEAD>

?<BODY>
? <TABLE id="mytable">
? <TR>
?<TD><input type="text" name="name" value="11111111" readonly="true"/></TD>
?<TD><input type="text" name="name" value="11111111"/></TD>
?<TD><input type="text" name="name" value="11111111"/></TD>
?<TD><input type="text" name="name" value="11111111"/></TD>
?<TD><input type="text" name="name" value="11111111"/></TD>
? </TR>
? <TR>
?<TD><input type="text" name="name" value="22222222"/></TD>
?<TD><input type="text" name="name" value="22222222"/></TD>
?<TD><input type="text" name="name" value="22222222"/></TD>
?<TD><input type="text" name="name" value="22222222"/></TD>
?<TD><input type="text" name="name" value="22222222"/></TD>
? </TR>
? <TR>
?<TD><input type="text" name="name" value="33333333"/></TD>
?<TD><input type="text" name="name" value="33333333"/></TD>
?<TD><input type="text" name="name" value="33333333"/></TD>
?<TD><input type="text" name="name" value="33333333"/></TD>
?<TD><input type="text" name="name" value="33333333"/></TD>
? </TR>
? <TR>
?<TD><input type="text" name="name" value="44444444"/></TD>
?<TD><input type="text" name="name" value="44444444"/></TD>
?<TD><input type="text" name="name" value="44444444"/></TD>
?<TD><input type="text" name="name" value="44444444"/></TD>
?<TD><input type="text" name="name" value="44444444"/></TD>
? </TR>
? </TABLE><br>
? <TABLE id="mytable2"></TABLE>
?</BODY>
? <script type="text/javascript">
?var tds = document.getElementsByTagName("td");
?var trs = document.getElementsByTagName("tr");
?var tab2 = document.getElementById("mytable2");
?var tdlen = tds.length;
?var trlen = trs.length;
?for(var i=0;i<tdlen;i++){
??//tds[i].onclick=tdClick;
?}
?for(var i=0;i<trlen;i++){
??trs[i].onclick=trClick;
??trs[i].onclick.x = i+1;
??//alert(trs[i].onclick);
?}

?function tdClick(str){
??var tab22 = document.getElementById("mytable2");
??var t2body = tab22.children[0];
??t2body.apendChildren(this.parentNode);
?}

?function trClick(){
?alert(arguments.callee.x);
??var tab22 = document.getElementById("mytable2");
??var t2body = tab22.children[0];
??
??var copyFlag = checkRowExit(tab22,this.rowIndex);
??//alert(copyFlag);
??if(copyFlag){
???var row = tab22.insertRow(tab22.rows.length);
???var td