javascript中onmouseover和onmouseout
发布网友
发布时间:2022-04-27 01:11
我来回答
共2个回答
热心网友
时间:2022-05-15 21:33
<html><head><title>关于表格颜色</title> <script language="JavaScript" type="text/javascript">
var tmpColor="";
var clickcolor="#aac6f8";
var arrBg=["#ffffff","#d8e9fd"]; //表格交替色 ///////////////单击改变行颜色////////////////
function clickto(){source=event.srcElement; <br>if (source.tagName=="TR"||source.tagName=="TABLE")return; <br>while(source.tagName!="TD")source=source.parentElement;source=source.parentElement; <br>var ss=source.parentElement; <br>while(ss.tagName!="TABLE"){ <br>ss=ss.parentElement;sst=ss.getElementsByTagName("td"); <br>for(k=0;k<sst.length;k++){sst[k].style.backgroundColor="";}}cs=source.children;
if(cs[1].style.backgroundColor!=clickcolor){for(i=0;i<cs.length;i++){cs[i].style.backgroundColor=clickcolor;}}
else{for(i=0;i<cs.length;i++){cs[i].style.backgroundColor="";}}}
///////////////单击改变行颜色//////////////// ///////////////鼠标onmousemove,onmouseout时的颜色////////////////////
function fmove(){
var e=event.srcElement;
if(e.tagName=="TD"){e.parentNode.style.backgroundColor="#aac6f8"};}
function fout(){
var e=event.srcElement;
var thisRow; //本行行数
if(e.tagName=="TD"){thisRow=e.parentElement.rowIndex;}
tmpColor=thisRow%2==0?arrBg[0]:arrBg[1]; //根据行数定颜色
if(e.tagName=="TD"){e.parentNode.style.backgroundColor=tmpColor;}
}
///////////////鼠标onmousemove,onmouseout时的颜色//////////////////// ///////////////设置表格交替色//////////////////////
function setTableBg(){
var oTr=t.rows;
var intLenTr=oTr.length;
var intLenBg=arrBg.length;
for(var i=0;i<intLenTr;i++){
intMod=i % intLenBg;
oTr[i].style.backgroundColor=arrBg[intMod];
}
}
///////////////设置表格交替色////////////////////// </script>
</head><body onload=setTableBg()> <table id="t" onmouseup="clickto()" onmousemove="fmove()" onmouseout="fout()" width="488" height="142" border="1">
<tr>
<td>第一行</td>
<td>essdgfs>rg</td>
<td>egweg</td>
</tr>
<tr>
<td>第二行</td>
<td>wewe</td>
<td>wayuiyuiyui</td>
</tr>
<tr>
<td>第三行</td>
<td>ewgwew</td>
<td>wegwesegeg</td>
</tr>
<tr>
<td>第四行</td>
<td>esrgferg</td>
<td>egweg</td>
</tr>
<tr>
<td>第五行</td>
<td>wewe</td>
<td>waegwe</td>
</tr>
<tr>
<td>第六行</td>
<td>ewgwew</td>
<td>wegwesegeg</td>
</tr>
</table> </body></html>
热心网友
时间:2022-05-15 22:51
你这样:
你给这个标签加个id属性,比如这样:<tr id="oTr">(把你的<tr>标签的其它属性去掉)。
之后你再加上这个就好:
<script type="text/javascript">
window.onload=furntion()
{
var theTr=document.getElementById('oTr');
theTr.onmouseover=fucntion()
{
this.style.backgroundColor='#efefef' ;
}
theTr.onmouseout=fucntion()
{
this.style.backgroundColor='';
}
}
</script>
不知道是不是回答了你的问题。不行你再HI我好了。