当前位置: 首页 > 图文教程 > 网络编程 > Javascript > js tr控制下面的tbody隐藏和显示

Javascript
网页对联广告代码效果大全
限制图片上传长宽的javascript代码
用javascript绘图—JS2D函数集
使主页呈现“飞舞”特效
用javascript实现浏览器地震效果
图片下拉选择器的制作
用JS将网页窗口由小变大
图片控制的渐变色文字
连续滚动的制作
制作仿“QQ秀”的虚拟形象
PHP与javascript对多项选择的处理
用JavaScrpt实现文件夹轻松加密
初学javascript之cookie篇(译)
javascript学习:基础继承机制
一个很通用的javascript的下拉菜单
javascript中的数组应用的一点发现
javascript表单之间的数据传递
一个简单的javascript菜单
预装载以及javascript Image()对象
网页软键盘,有效的防止监测键盘的木马软件

Javascript 中的 js tr控制下面的tbody隐藏和显示


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 261 ::
收藏到网摘: n/a

这个问题弄了我几天没心思写程序,问了论坛很多网友才搞定的。 用的核心代码
function $(obj){
return document.getElementById(obj);
}
window.onload = function(){
var table = document.getElementById("myTable");
//如果在表格区域内产生单击
table.onclick = function(e){
var e = window.event||e,target = e.srcElement||e.target;
//得到tr
while(target.tagName.toLowerCase() != "tr"){
target = target.parentNode;
}
var i = target.rowIndex;
//单击单行的Tr的话就是控制tr + 1的隐藏和显示
if(i%2 == 0){
var nrs = table.rows[i + 1].parentNode.style;
nrs.display = nrs.display == "none"?"":"none";
}
}
}
</script>
点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]