<style>
.height{
background:#666666; /*背景颜色为灰色*/
}
tr{
cursor: pointer; /*手形*/
}
</style>
<body>
<table border="1" width="40%">
<tr><th></th><th align="left">姓名</th><th align="left">性别</th><th align="left">居住地</th></tr>
<tr>
<td><input type="radio" name="radio" /></td><td>张三</td><td>男</td><td>北京</td>
</tr>
<tr>
<td><input type="radio" name="radio" /></td><td>李四</td><td>男</td><td>上海</td>
</tr>
<tr>
<td><input type="radio" name="radio" /></td><td>王五</td><td>女</td><td>深圳</td>
</tr>
<tr>
<td><input type="radio" name="radio" /></td><td>赵六</td><td>女</td><td>北京</td>
</tr>
<tr>
<td><input type="radio" name="radio" /></td><td>孙七</td><td>男</td><td>上海</td>
</tr>
</table>
</body>
jquery
$(document).ready(function(){
//第一种写法: $("tr:gt(0)") 第一行标题不起作用
$("tr:gt(0)").click(function(){
$(this).addClass("height").siblings().removeClass("height").end().find(":radio").attr("checked",true);
})
//第二种写法：$("tr:not(:first)")
/*$("tr:not(:first)").click(function(){
$(this).addClass("height").siblings().removeClass("height").end().find(":radio").attr("checked",true);
})*/
})
分享到：
相关推荐
jquery实现控制表格行高亮实例，需要的朋友可以参考一下
拖拽改变列宽的功能网上很多，但是拖拽改变行高的我搜了很久，也没有发现可以用的。所以利用原有改变行高的模版，自己写了一个原生javascrript改变列宽的模版。
这是一款经过样式美化的jQuery表格信息自动向上滚动代码，鼠标悬停表格行高亮显示，并停止滚动。
主要介绍了jQuery插件实现表格隔行变色及鼠标滑过高亮显示效果代码,涉及jQuery针对页面元素动态操作及响应鼠标事件动态修改页面元素样式的相关技巧,需要的朋友可以参考下
主要介绍了jQuery实现Table表格隔行变色及高亮显示当前选择行效果,涉及jQuery针对table元素遍历、运算、样式及鼠标事件动态响应相关操作技巧,需要的朋友可以参考下
jQuery简单仿Excel表格功能插件，按下鼠标左键不放，可范围选择多个单元格区块，鼠标右键进行操作，可以拖动列宽，行高，对齐方式，合并单元格，上方插入一行，下方插入一行，左边插入一列，右边插入一列，删除行，...
上篇博客写的是复选框的，这次写的是单选框的，有时查询的时候，只能选择一条记录，如果将选中的这条记录的行高亮显示，同时该行的单选按钮也被选中了，这样会提高用户的体验的。如今的时代，就是用户体验的时代。 ...
Excel表格功能jQuery插件是一款可以拖动列宽，行高，对齐方式，合并单元格，上方插入一行，下方插入一行，左边插入一列，右边插入一列，删除行，删除列，自定义宽行列等一系列excel功能。
Excel表格功能jQuery插件是一款可以拖动列宽，行高，对齐方式，合并单元格，上方插入一行，下方插入一行，左边插入一列，右边插入一列，删除行，删除列，自定义宽行列等一系列excel功能。
它提供了最快的jQuery网格，treegrid，pivot网格和电子表格等最令人垂涎的功能，并且基于性能，卓越的UX和开放标准的原则构建。Pro的以下功能是对ParamQuery Grid基本功能的补充。 专业功能： 也可用于...
Frappe数据表网络的现代数据表库介绍Frappe DataTable是一个简单，现代且交互式的数据表库，用于显示表格数据。 它最初是为构建的，可用于渲染大量行而不牺牲性能，并且具有基本的数据网格功能，如内联编辑和键盘...