为什么我的事件代码无效
qq_黑泽明_0
2016-11-08 01:33
<!DOCTYPE html>
<html>
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
<script type="text/javascript">
window.onload = function() {
var mytr = document.getElementsByTagName("tr");
alert(mytr.length);
for (var i = 0; i < mytr.length; i++) {
// 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
mytr[i].onmouseover = function () {
mytr[i].style.backgroundColor = "f2f2f2";
}
mytr[i].onmouseout = function () {
mytr[i].style.backgroundColor = "fff";
}
}
}
// 编写一个函数，供添加按钮调用，动态在表格的最后一行添加子节点；
function add() {
var tableobj=document.getElementById("table");
//获得tableobj子节点的个数
var tableobjChildnum=tableobj.childNodes.length;
//增加tr.th节点
var tr1=document.createElement("tr");
var tdXh=document.createElement("td");
var tdName=document.createElement("td");
var tddel=document.createElement("td");
//为tr.th节点中的HTML赋值
var xh=prompt("请输入学号","");
//判断输入的值是否为正整数
var a;
if(a=(xh!=null&&xh>0&&!isNaN(xh))){
tdXh.innerHTML="xh"+xh;
tr1.appendChild(tdXh);
}else {
alert("请重新输入,输入值必须为正整数");
}
//判断输入的值是否为汉字
var name=prompt("请输入姓名","");
var reg = new RegExp("[\\u4E00-\\u9FFF]+","g");
var b;
if(b=reg.test(name)){
tdName.innerHTML=name;
tr1.appendChild(tdName);
}else{
alert("请重新输入,输入值必须为汉字");
}
tddel.innerHTML="<a href='javascript:;' onclick='del(this)' >删除</a>";
//将tr.th节点加入到table表格中的最后一行
//判断是否输入学号和姓名
if(a==true&&b==true){
tr1.appendChild(tddel);
tableobj.appendChild(tr1);
}
}
// 创建删除函数
function del(obj) {
var thisobj = obj.parentNode.parentNode;
thisobj.parentNode.removeChild(thisobj);
}
</script>
</head>
<body>
<table border="1" width="50%" id="table">
<tr>
<th>学号</th>
<th>姓名</th>
<th>操作</th>
</tr>
<tr>
<td>xh001</td>
<td>王小明</td>
<td><a href="javascript:;" onclick="del(this)">删除</a></td> <!--在删除按钮上添加点击事件 -->
</tr>
<tr>
<td>xh002</td>
<td>刘小芳</td>
<td><a href="javascript:;" onclick="del(this)" >删除</a></td> <!--在删除按钮上添加点击事件 -->
</tr>
</table>
<input type="button" onclick="add()" value="添加一行" /> <!--在添加按钮上添加点击事件 -->
</body>
</html>
求帮助
3回答
-
- stone310
- 2016-11-08 06:54:22
注释说明
mytr[i].onmouseover = function () { this.style.backgroundColor = "#f2f2f2"; //用this，指当前触发事件，这里的i已经是定值了；颜色加# } mytr[i].onmouseout = function () { this.style.backgroundColor = "#fff"; //同上 } -
- qq_黑泽明_0
- 2016-11-08 22:07:44
这样也是可以的 -
- qq_黑泽明_0
- 2016-11-08 10:41:18
或者换句话说我跟这个代码有什么区别,我的参数进去不也是跟他一样么?
JavaScript进阶篇
468061 学习 · 21891 问题
相似问题