您的位置:首页 > Web前端 > JavaScript

鼠标点击表格行背景变色

2006-05-16 00:59 369 查看
代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD><TITLE>鼠标点击表格行背景变色</TITLE>
<style>
td{width:30px;height:30px;background-color:pink;}
</style>
</HEAD>
<BODY>
<table border=1 bordercolor="black" id="tb">
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
</table>
<SCRIPT LANGUAGE="JavaScript">
<!--
var TD = tb.all.tags("TD");
var ObjTemp=null;
var eventColor={mouseover:"blue",mouseout:"pink",click:"red"};
for (var i=0;i<TD.length;i++){
TD(i).onmouseover=TdEvent;
TD(i).onmouseout =TdEvent;
TD(i).onclick =TdEvent;
}
function TdEvent(){
var obj = event.srcElement;
if (ObjTemp==obj) return;
obj.style.backgroundColor=eval("eventColor."+event.type);
if (event.type=="click") {
if (ObjTemp!=null)ObjTemp.style.backgroundColor="";
ObjTemp=obj;
}}
//-->
</SCRIPT>
</BODY>
</HTML>

[Ctrl+A 全选 提示:你可先修改部分代码,再点运行代码]
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
相关文章推荐