鼠标点击表格行背景变色

王朝other·作者佚名  2006-05-16
窄屏简体版  字體: |||超大  

代码如下:

<!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 全选 提示:你可先修改部分代码,再点运行代码]

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
 
© 2005- 王朝網路 版權所有  導航