javascript动态创建表格，设置双击事件，传参数时被覆盖为最后一行数据，在线等！有原码
<html><head><title></title><styletype="text/css">.onmouseout1{background-color:#EAF2F...
<html>
<head>
<title></title>
<style type="text/css">
.onmouseout1{
background-color:#EAF2FB;
}
.onmouseout2{
background-color:#CDE0F5;
}
.onmousemove{
background-color:#00FF00
}
</style>
<script>
function start() {
/**var allButton=document.getElementsByTagName("input");
alert(allButton);
for(var s=0;s<allButton.length;s++){
var button=allButton[s];
if(button.type="button"){
button.disabled=true;
}
}*/
//获取body标签
var mybody = document.getElementsByTagName("body")[0];
// 创建一个<table>元素和一个<tbody>元素
table1 = document.createElement("table");
mytablebody = document.createElement("tbody");
//创建所有的单元格
myArray = new Array('aaa','bbb','ccc','dddd');
my = new Array('111','2222','3333','4444');
for(var j = 0; j <4; j++) {
// 创建一个<tr>元素
myArray[j] = document.createElement("tr"); //onMouseMove onMouseOut
// mycurrent_row.attachEvent("ondbclick",onclick(j));
myArray[j].onmousemove=function(){onmousemove(this);};
myArray[j].onmouseout=function(){onmouseout(this);};
myArray[j].ondblclick=function(){ondbclick(j);};
for(var i = 0; i <4; i++) {
alert(my[i]);
// 创建一个<td>元素--列
mycurrent_cell = document.createElement("td");
//创建一个文本节点
currenttext = document.createTextNode(my[i]);
mycurrent_cell.appendChild(currenttext);
// 将列<td>添加到行<tr>
myArray[j].appendChild(mycurrent_cell);
}
// 将行<tr>添加到<tbody>
mytablebody.appendChild(myArray[j]);
}
// 将<tbody>添加到<table>
table1.appendChild(mytablebody);
//将<table>添加到<body>
mybody.appendChild(table1);
table1.setAttribute("border", "2");
table1.setAttribute("cellspacing", "3");//无效 ？？
table1.setAttribute("cellpadding", "2");//无效 ？？
}
function ondbclick(j){
alert(j);
}
function onmousemove(i){
i.className="red";
}
function onmouseout(i){
i.className="blue";
}
</script>
</head>
<body onLoad="start()">
</body>
</html> 展开
<head>
<title></title>
<style type="text/css">
.onmouseout1{
background-color:#EAF2FB;
}
.onmouseout2{
background-color:#CDE0F5;
}
.onmousemove{
background-color:#00FF00
}
</style>
<script>
function start() {
/**var allButton=document.getElementsByTagName("input");
alert(allButton);
for(var s=0;s<allButton.length;s++){
var button=allButton[s];
if(button.type="button"){
button.disabled=true;
}
}*/
//获取body标签
var mybody = document.getElementsByTagName("body")[0];
// 创建一个<table>元素和一个<tbody>元素
table1 = document.createElement("table");
mytablebody = document.createElement("tbody");
//创建所有的单元格
myArray = new Array('aaa','bbb','ccc','dddd');
my = new Array('111','2222','3333','4444');
for(var j = 0; j <4; j++) {
// 创建一个<tr>元素
myArray[j] = document.createElement("tr"); //onMouseMove onMouseOut
// mycurrent_row.attachEvent("ondbclick",onclick(j));
myArray[j].onmousemove=function(){onmousemove(this);};
myArray[j].onmouseout=function(){onmouseout(this);};
myArray[j].ondblclick=function(){ondbclick(j);};
for(var i = 0; i <4; i++) {
alert(my[i]);
// 创建一个<td>元素--列
mycurrent_cell = document.createElement("td");
//创建一个文本节点
currenttext = document.createTextNode(my[i]);
mycurrent_cell.appendChild(currenttext);
// 将列<td>添加到行<tr>
myArray[j].appendChild(mycurrent_cell);
}
// 将行<tr>添加到<tbody>
mytablebody.appendChild(myArray[j]);
}
// 将<tbody>添加到<table>
table1.appendChild(mytablebody);
//将<table>添加到<body>
mybody.appendChild(table1);
table1.setAttribute("border", "2");
table1.setAttribute("cellspacing", "3");//无效 ？？
table1.setAttribute("cellpadding", "2");//无效 ？？
}
function ondbclick(j){
alert(j);
}
function onmousemove(i){
i.className="red";
}
function onmouseout(i){
i.className="blue";
}
</script>
</head>
<body onLoad="start()">
</body>
</html> 展开
提示该问答中所提及的号码未经验证，请注意甄别。
3个回答
展开全部
函数对象，在存在参数，或动态变量时，执行时会使用当前值进行操作
上面代码的参数就属于动态型的，运行时调用当前值，自然为4
解决方法
1.即时编译代码（将动态参数变成“死参”）
myArray[j].ondblclick = new Function("ondbclick(" + j + ");");
2.固定参数值（n 的有效区域为 setFun 函数内，所以不受 j 的值的影响）
setFun(myArray[j], j);
function setFun(obj, n) {//该函数定义在最外围，与start() 并列
obj.ondblclick = function () { ondbclick(n); };
}
如果你只是想要当前行的行号的话，建议使用 rowIndex
myArray[j].ondblclick = function () { ondbclick(this); };
function ondbclick(tr) { alert(tr.rowIndex);}
使用 rowIndex 的话，在增减行的时候也不会出错
table1.setAttribute("cellspacing", "3");
使用 js 赋属性的时候，cellspacing 非规范写法，所以会有浏览器兼容问题
其中 s 应为大写，cellSpacing，cellPadding
双单词，第二个单词首字母大写
上面代码的参数就属于动态型的，运行时调用当前值，自然为4
解决方法
1.即时编译代码（将动态参数变成“死参”）
myArray[j].ondblclick = new Function("ondbclick(" + j + ");");
2.固定参数值（n 的有效区域为 setFun 函数内，所以不受 j 的值的影响）
setFun(myArray[j], j);
function setFun(obj, n) {//该函数定义在最外围，与start() 并列
obj.ondblclick = function () { ondbclick(n); };
}
如果你只是想要当前行的行号的话，建议使用 rowIndex
myArray[j].ondblclick = function () { ondbclick(this); };
function ondbclick(tr) { alert(tr.rowIndex);}
使用 rowIndex 的话，在增减行的时候也不会出错
table1.setAttribute("cellspacing", "3");
使用 js 赋属性的时候，cellspacing 非规范写法，所以会有浏览器兼容问题
其中 s 应为大写，cellSpacing，cellPadding
双单词，第二个单词首字母大写
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
双击的时候弹出4的问题？你这么写到哪儿就应该是4啊。
myArray[j] = document.createElement("tr"); //onMouseMove onMouseOut
myArray[j].id=j;
// mycurrent_row.attachEvent("ondbclick",onclick(j));
myArray[j].onmousemove=function(){onmousemove(this);};
myArray[j].onmouseout=function(){onmouseout(this);};
myArray[j].ondblclick= function(){ondbclick(this.id);};
加个id属性，存一下值就好了。
myArray[j] = document.createElement("tr"); //onMouseMove onMouseOut
myArray[j].id=j;
// mycurrent_row.attachEvent("ondbclick",onclick(j));
myArray[j].onmousemove=function(){onmousemove(this);};
myArray[j].onmouseout=function(){onmouseout(this);};
myArray[j].ondblclick= function(){ondbclick(this.id);};
加个id属性，存一下值就好了。
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
ai
联系我，我给你demo呀：815083620
联系我，我给你demo呀：815083620
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
