表格展开伸缩
2011-07-21 16:36 Rollen Holt 阅读(1309) 评论(0) 编辑 收藏 举报原始
点击之后:
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> < html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> < head > < title ></ title > < link href="css/style.css" rel="stylesheet" type="text/css" /> <!-- 引入jQuery --> < script src="../scripts/jquery-1.3.1.js" type="text/javascript"></ script > < script type="text/javascript"> $(function(){ $('tr.parent').click(function(){ // 获取所谓的父行 $(this) .toggleClass("selected") // 添加/删除高亮 .siblings('.child_'+this.id).toggle(); // 隐藏/显示所谓的子行 }); }) </ script > </ head > < body > < table > < thead > < tr >< th >姓名</ th >< th >性别</ th >< th >暂住地</ th ></ tr > </ thead > < tbody > < tr class="parent" id="row_01">< td colspan="3">前台设计组</ td ></ tr > < tr class="child_row_01">< td >张山</ td >< td >男</ td >< td >浙江宁波</ td ></ tr > < tr class="child_row_01">< td >李四</ td >< td >女</ td >< td >浙江杭州</ td ></ tr > < tr class="parent" id="row_02">< td colspan="3">前台开发组</ td ></ tr > < tr class="child_row_02">< td >王五</ td >< td >男</ td >< td >湖南长沙</ td ></ tr > < tr class="child_row_02">< td >找六</ td >< td >男</ td >< td >浙江温州</ td ></ tr > < tr class="parent" id="row_03">< td colspan="3">后台开发组</ td ></ tr > < tr class="child_row_03">< td >Rain</ td >< td >男</ td >< td >浙江杭州</ td ></ tr > < tr class="child_row_03">< td >MAXMAN</ td >< td >女</ td >< td >浙江杭州</ td ></ tr > </ tbody > </ table > </ body > </ html > |
==============================================================================
本博客已经废弃,不在维护。新博客地址:http://wenchao.ren
我喜欢程序员,他们单纯、固执、容易体会到成就感;面对压力,能够挑灯夜战不眠不休;面对困难,能够迎难而上挑战自我。他
们也会感到困惑与傍徨,但每个程序员的心中都有一个比尔盖茨或是乔布斯的梦想“用智慧开创属于自己的事业”。我想说的是,其
实我是一个程序员
==============================================================================
![](http://service.t.sina.com.cn/widget/qmd/1882500857/8c17d4b5/1.png)
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步