一种实用的表格行鼠标点击高亮效果
偶尔在看天天基金网净值公告时，从源代码里剥下的一段js代码，感觉比较实用，分享一下(仅IE有效)
<script??type="text/javascript">
var?highlightcolor='#E0F2FE';
var?clickcolor='#ffedd2';
function??MouseOver(){
????var?source=event.srcElement;????????
????if??(source.tagName=="TD"){????????
????????source=source.parentElement;
????????var?cells??=??source.children;????
????????if??(cells[0].style.backgroundColor!=highlightcolor&&cells[0].style.backgroundColor!=clickcolor)
????????????for(i=0;i<cells.length;i++){
????????????????cells[i].style.backgroundColor=highlightcolor;
????????????}????????
????}
}
function??MouseOut(){????
????var?source=event.srcElement;
????if??(source.tagName=="TD"){????
????????source=source.parentElement;
????????var?cells??=??source.children;????
????????if??(cells[0].style.backgroundColor!=clickcolor)????
????????????for(i=0;i<cells.length;i++){
????????????????cells[i].style.backgroundColor="";
????????????}????????
????}
}
function??MouseClick(){
????var?source=event.srcElement;
????if??(source.tagName=="TD"){????
????????source=source.parentElement;
????????var?cells??=??source.children;
????????if??(cells[0].style.backgroundColor!=clickcolor)
????????????for(i=0;i<cells.length;i++)
????????????????cells[i].style.backgroundColor=clickcolor;????????????
????????else
????????????for(i=0;i<cells.length;i++)
????????????????cells[i].style.backgroundColor="";????
????}
}
</script>
<table?onmouseover="MouseOver()"?onclick="MouseClick()"??onmouseout="MouseOut()"?cellspacing="0"?bordercolordark="#ffffff"??bordercolorlight="#cccccc"??border="1"?width="80%"?align="center"?style="cursor:pointer">??
????<tr>
??????<td>1</td>
??????<td>a</td>
??????<td>b</td>?????
????</tr>
????<tr>
??????<td>2</td>
??????<td>c</td>
??????<td>d</td>?????
????</tr>
????<tr>
??????<td>3</td>
??????<td>e</td>
??????<td>f?</td>?????
????</tr>??
????<tr>
??????<td>4</td>
??????<td>g</td>
??????<td>h?</td>?????
????</tr>??
</table>
本文参与?腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2008-01-05 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读