<!DOCTYPE html>
<html lang="zh-cn">
<head>
 <meta charset="utf-8">
 <title></title>
 <style>

    table{
   border:1px solid #000;
   width: 400px;
   text-align: center;
   border-collapse: collapse;
  }
  thead tr{
   border: 1px solid #000;
  }
  .selected{
   background:red;
  }
 </style>
</head>
<body>
  <table>
  <thead>
    <tr>
    <th></th>
    <th>姓名</th>
    <th>性别</th>
    <th>暂住地</th>
   </tr>
  </thead>
  <tbody>
    <tr><td><input id="d1" type="radio"/></td><td>张山1</td><td>男</td><td>浙江宁波</td></tr>
    <tr><td><input id="d2" type="radio"/></td><td>张山2</td><td>男</td><td>浙江宁波</td></tr>
    <tr><td><input id="d3" type="radio"/></td><td>张山3</td><td>男</td><td>浙江宁波</td></tr>
    <tr><td><input id="d4" type="radio"/></td><td>张山4</td><td>男</td><td>浙江宁波</td></tr>
    <tr><td><input id="d5" type="radio"/></td><td>张山5</td><td>男</td><td>浙江宁波</td></tr>
    <tr><td><input id="d6" type="radio"/></td><td>张山6</td><td>男</td><td>浙江宁波</td></tr>
  </tbody>
 </table>
</body>
<script src="js/jquery-1.11.3.js"></script>
<script>
 //jquery有一些弊病，checked这样的是没有属性值的，不能用attr("checked",true)
 $(function(){
  $('tbody>tr').click(function(){
    var $thisonly=$(this);
    if($thisonly.find(':radio')[0].checked){
     $thisonly.removeClass('selected');
     $thisonly.find(':radio')[0].checked=false;
    }else{
     $thisonly.addClass('selected').siblings().removeClass('selected');
     $thisonly.find(':radio')[0].checked=true;
     $('table :radio:checked').parent().parent().addClass('selected');
    }
   }
  )
 })
</script>
</html>

Jquery 组 radio控与tr变色的更多相关文章

  1. Jquery 操作Html 控件 CheckBox、Radio、Select 控件 【转】http://www.cnblogs.com/lxblog/archive/2013/01/09/2853056.html

    Jquery 操作Html 控件 CheckBox.Radio.Select 控件   在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio ...

  2. Jquery 操作Html 控件 CheckBox、Radio、Select 控件

    在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio.select,用 Jquery 库操作其他会方便很多,下面用Jq对这些控件的操作进行一 ...

  3. Jquery Mobile下设置radio控件选中

    问题: .html文件头部引入了: <script src="js/jquery.js"></script> <script src="js ...

  4. jquery select radio

    Query获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...});   //为S ...

  5. Jquery获取服务器端控件的三种方式

    一 Jquery获得服务器控件值的方法由于ASP.NET网页运行后,服务器控件会随机生成客户端id,jquery获取时候不太好操作,google了下,总结有以下3种方法: 服务器控件代码:<as ...

  6. jquery控制radio选中

    好久没写jquery了,昨天下午写一个效果,结果倒腾了半天还是没有解决,好在今天早上在网上询问到解决方法了,现在果断记录下. 要实现的效果就是交易方式选择时不同的交易方式下默认选中第一个选项. 如下: ...

  7. Jquery常用radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关设置

    获取一组radio被选中项的值:var item = $('input[name=items][checked]').val(); 获取select被选中项的文本:var item = $(" ...

  8. JQuery判断radio是否选中，获取选中值

    本文摘自:http://www.cnblogs.com/xcj1989/archive/2011/06/29/JQUERY_RADIO.html   /*----------------------- ...

  9. 基于jQuery 常用WEB控件收集

    Horizontal accordion: jQuery 基于jQuery开发,非常简单的水平方向折叠控件. Horizontal accordion: jQuery jQuery-Horizonta ...

随机推荐

  1. 最小生成树（图论）--3366lg【模版】

    题目描述 如题,给出一个无向图,求出最小生成树,如果该图不连通,则输出orz 输入输出格式 输入格式: 第一行包含两个整数N.M,表示该图共有N个结点和M条无向边.(N<=5000,M<= ...

  2. QT中PRO文件写法的详细介绍

    学习Qt时,发现有些知识看了不经常用就忘了,以下是书本上写的一些关于qmake的相关知识,自己看后,打算把一些经常用到的记下来,整理整理. Qt程序一般使用Qt提供的qmake工具来编译. qmake ...

  3. stm32 中断号和中断处理函数建立关系

    转载:https://www.cnblogs.com/heny-hui/p/7130620.html stm32的中断号根据不同内核和型号,st公司给的官方库中对相应的中断号进行了设置,我们用到哪一个 ...

  4. HDU2066（SPFA+前向星）

    https://vjudge.net/problem/HDU-2066 虽然草儿是个路痴(就是在杭电待了一年多,居然还会在校园里迷路的人,汗~),但是草儿仍然很喜欢旅行,因为在旅途中 会遇见很多人(白 ...

  5. ubuntu RPLIDAR A2的使用

    RPLIDAR是由RoboPeak Team,SlamTec公司开发的低成本2D LIDAR解决方案.它可以扫描6度半径内的360°环境. RPLIDAR的输出非常适合构建地图,做slam或构建3D模 ...

  6. jmeter（十三）常见问题及解决方法

    jmeter作为一个开源的纯Java性能测试工具,工作中极大的方便了我们进行接口.性能测试,但使用过程中也遇到了很多的问题,下面就记录一下自己遇到的问题,后续会不断更新... 1.获取日志 在使用jm ...

  7. IIS 8的第一次请求不变慢如何配置

    首先需要在Window中添加Application Initialization 在IIS中配置Application Pool 在IIS配置Web Site 配置完成,如果版本在7.5,可以下载:A ...

  8. vba 弹框

    '第三个按钮,上传数据到数据库 Private Sub CommandButton1_Click() str1 = "abcde" str2 = InputBox("请输 ...

  9. 免安装的Tomcat基本配置和安装

    大家都知道tomcat吧!因为Tomcat 技术先进.性能稳定,而且免费,因而深受Java 爱好者的喜爱并得到了部分软件开发商的认可,成为目前比较流行的Web 应用服务器,也是运行Servlet和JS ...

  10. CF888G Xor-MST 生成树、分治、Trie树合并

    传送门 第一次接触到Boruvka求最小生成树 它的原版本是:初始每一个点构成一个连通块,每一次找到每一个连通块到其他的连通块权值最短的边,然后合并这两个连通块.因为每一次连通块个数至少减半,所以复杂 ...