html 表单折叠实现,jQuery实现表格展开与折叠的方法

本文实例讲述了jQuery实现表格展开与折叠的方法。分享给大家供大家参考。具体分析如下：

这是很人性化的一款特效代码，实现点击其中一个父级，另一个之前打开的父级会自动关闭

jQuery表格展开折叠，默认折叠

table{ border:0;border-collapse:collapse;}

td{ font:normal 12px/17px Arial;padding:2px;width:100px;}

th{ font:bold 12px/17px Arial;text-align:left;

padding:4px;border-bottom:1px solid #333;

width:100px;

}

.parent { background:#FFF38F;cursor:pointer;} /* 偶数行样式*/

.odd{ background:#FFFFEE;} /* 奇数行样式*/

.selected{ background:#FF6500;color:#fff;}

$(function (){

$(".parent").click(function(){

$(this).toggleClass("selected");

$(this).siblings().not(".parent").not(":first-child").hide();

$(this).next().show().next().show();

});

})

姓名	性别	暂住地
张山	男	浙江宁波
张山	男	浙江宁波
李四	女	浙江杭州
前台开发组
王五	男	湖南长沙
找六	男	浙江温州
后台开发组
Rain	男	浙江杭州
MAXMAN	女	浙江杭州

希望本文所述对大家的jQuery程序设计有所帮助。