鼠标移动到某个单元格上后，整个列都变色的实现方法- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 鼠标移动到某个单元格上后，整个列都变色的实现方法

Javascript: javascript 实现的类似hao123的多邮箱登录效果; 不错的用resizeTo和moveTo两个函数实现窗口的“打乒乓球”效果; 出现“不能执行已释放的Script代码”错误的原因及解决办法; “不能执行已释放的Script代码”错误的原因及解决办法; javascript入门·对象属性方法大总结; javascript入门·动态的时钟,显示完整的一些方法,新年倒计时; JavaScript 入门·JavaScript 具有全范围的运算符; 用javascript实现代替marquee的滚动字幕效果代码; [原创]仿google adsense颜色选择器代码，从中易广告联盟程序提取; greenbrower用到的function.js代码集合; javascript flash下fromCharCode和charCodeAt方法使用说明; 内部的小页面，用层制作，随机变色; javascript简写效果“神秘的眼睛”; 用js写“算24”游戏的思路分析与实现代码; [原创]js循环输出图片，不足的要补0; json简单介绍; javascript 获取网页参数系统; [原创]js判断ie方法集锦（含正则）代码短小经典; javascript SocialHistory 检查访问者是否访问过某站点; [原创]js判断是否有中文的脚本_js判断中文方法集合

No. « ‹ 182 183 184 185 › »

技术文章搜索

关键字

Javascript 中的鼠标移动到某个单元格上后，整个列都变色的实现方法

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 277 ::

收藏到网摘: n/a

如何丰富alt属性的显示效果用JavaScript实现字符串切分功能

点击运行可以看到效果:
[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

以上代码可以实现鼠标移动到单元格上，单元格变色，现在我想实现鼠标移动到某个单元格上后，整个列都变色不知道可以不可以实现呢？

点击运行可以看到效果:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>如何定义表格的鼠标隔列变色行为</title>
<style>
body { font: normal 12px auto "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color: #4f6b72; background: #E6EAE9;
}
.mytable { width: 80%; padding: 0; margin: 0;
}
.mytable td { border-bottom: 1px solid #C1DAD7; background: #fff; font-size:12px; padding: 6px 6px 6px 0px; align:center; color: #4f6b72;
}
td.alt { background: #F5FAFA; text-align:center; color: #797268;
}
td.baialt { background: #FFFFFF; text-align:center; color: #000;
}
td.spec { border-top: 0; background: #fff ; text-align:center; font: 12px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}
td.specalt { border-top: 0; background: #f5fafa ; text-align:center; font: 12px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color: #797268;
}
</style>
</head>
<script language="javascript">
function senfe(sid){ var tds=sid.getElementsByTagName("td") for(var i=0;i<tds.length;i++){ if(tds[i].className=='alt'){ tds[i].className="baialt"; }else{ tds[i].className="alt"; } }
}
</script>
<body> <div align="center"> <table class=mytable cellspacing="0" id="table1" onmouseover="senfe(this)" onmouseout="senfe(this)"> <tr> <td class="alt" height="45"></td> <td class="baialt" height="45"></td> <td class="alt" height="45"></td> <td class="baialt" height="45"></td> <td class="alt" height="45"></td> </tr> <tr> <td class="alt" height="45"></td> <td class="baialt" height="45"></td> <td class="alt" height="45"></td> <td class="baialt" height="45"></td> <td class="alt" height="45"></td> </tr> <tr> <td class="alt" height="45"></td> <td class="baialt" height="45"></td> <td class="alt" height="45"></td> <td class="baialt" height="45"></td> <td class="alt" height="45"></td> </tr> <tr> <td class="alt" height="45"></td> <td class="baialt" height="45"></td> <td class="alt" height="45"></td> <td class="baialt" height="45"></td> <td class="alt" height="45"></td> </tr> </table> </div> <p align="center">当鼠标经过时希望实现隔列变色（最好是反色） ，效果示例如下： <div align="center"> <table class=mytable cellspacing="0" id="table2"> <tr align="center"> <td class="baialt" height="45"></td> <td class="alt" height="45"></td> <td class="baialt" height="45"></td> <td class="alt" height="45"></td> <td class="baialt" height="45"></td> </tr> </table> </div>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

代码已经帖上来，现在鼠标移动到单元格变色
phx.rows[i].cells[j].onmouseover=function()
{
if(pObj!=this){
this.bgColor=overcolor;}
}
以及移出单元格变色
phx.rows[i].cells[j].onmouseout=function()
{
if(pObj!=this){
this.bgColor=outcolor;}
}
都已经解决·
剩下的问题是phx.rows[i].cells[j].onclick也就是我单击了表格的某个单元格后，希望这个单元格所在的那一列都可以变色，请问如何处理呢？

点击运行可以看到效果:

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

如何丰富alt属性的显示效果用JavaScript实现字符串切分功能

Javascript 中的 鼠标移动到某个单元格上后，整个列都变色的实现方法

评论 (0) All

Javascript 中的鼠标移动到某个单元格上后，整个列都变色的实现方法