87,901
社区成员
发帖
与我相关
我的任务
分享
<script type="text/javascript">
function changeColor(obj,color){
obj.bgColor = color;
}
window.onload = function(){
var trid = document.getElementById("trid");
trid.addEventListener("mousemove",changeColor(trid,"white"),false);
trid.addEventListener("mouseout",changeColor(trid,"#f4f4f4"),false);
}
</script>
</head>
<body>
<table border="1" cellpadding="9" cellspacing="1" bgcolor="#f4f4f4">
<tr onmousemove="changeColor(this,'white')" onmouseout="changeColor(this,'#f4f4f4')">
<td>学号</td>
<td>姓名</td>
<td>性别</td>
</tr>
<tr id="trid">
<td>001</td>
<td>张三</td>
<td>男</td>
</tr>
<tr id="trid1">
<td>002</td>
<td>李四</td>
<td>男</td>
</tr>
function changeColor(obj,color){
obj.bgColor = color;
}
window.onload = function(){
var trid = document.getElementById("trid");
trid.addEventListener("mousemove",changeColor(trid,"white"),false);
trid.addEventListener("mouseout",changeColor(trid,"#f4f4f4"),false);
}
1. DOM2 的事件注册方式 addEventListener
elt.addEventListener( 事件类型, 事件处理函数, 是否捕获 )
2. 分析 trid.addEventListener("mousemove",changeColor(trid,"white"),false);
2.1 页面载入完毕,执行通过DOM1方式在window对象上对load事件类型注册的事件处理程序
function(){
var trid = document.getElementById("trid");
trid.addEventListener("mousemove",changeColor(trid,"white"),false);
trid.addEventListener("mouseout",changeColor(trid,"#f4f4f4"),false);
}
2.2 执行 trid.addEventListener("mousemove",changeColor(trid,"white"),false);
2.2.1 执行表达式
1)trid => trid(HTMLElement)
2)"mousemove" => "mousemove"
3)changeColor(trid,"white") => undefined(函数已经执行,返回值为undefined)
4)false => false
2.2.2 表达式执行完毕
trid.addEventListener("mousemove", undefined, false );
3. 综上所诉,你应该改成这样
trid.addEventListener("mousemove", function () {
changeColor(trid,"white")
} ,false);
因为 addEventListener 方法的第二个参数需要的是一个函数。