现在有一个表格,当我选择checkbox时,同是会出现高亮的效果!我选择一个checkbox时,是可以的,当我选择第二个checkbox,第一个checkbox和第二个都是选中状态(高亮效果是好的),我用radio可以达到,我每个radio都加了name;关键代码:"[name=ra]:radio").attr("checked"),但是checkbox加了却不行!<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
<style type="text/css">
    .odd
    {
      background:#fafafa;
    }
    .even
    {
        background:#f0f0f0;
    }
    table
    {
         border:0;
          border-collapse:collapse;<%--合并单元格--%>
    }
    th,td
    {
        width:100px;
        text-align:left;
    }
    .selected
    {
        background:blue;
    }
</style>
<script type="text/javascript" src="jquery-1.3.2-vsdoc2.js"></script>
<script type="text/javascript">
    $(function() {
        $("tbody>tr:odd").addClass("odd"); //先排除第一行,然后给奇数行添加样式
        $("tbody>tr:even").addClass("even"); //先排除第一行,然后给偶数行添加样式
        $('tbody>tr').click(function() {
            $(this)
.addClass('selected')
.siblings().removeClass('selected')
.end()
.find("[name=ra]:checkbox").attr("checked"); //记住要加name属性        });
    });
</script>    
</head>
<body>
   <table>
     <thead>
        <tr><th></th><th>姓名</th><th>性别</th><th>暂住地</th></tr>
     </thead>
     <tbody>
    
          <tr><td><input type="checkbox" name="ra"  id="ra1" /></td><td>张三</td><td>女</td><td>湖南长沙</td></tr>
          <tr><td><input type="checkbox" name="ra" id="Radio1" /></td><td>李四</td><td>男</td><td>湖北武汉</td></tr>
          <tr><td><input type="checkbox" name="ra" id="Radio2" /></td><td>王五</td><td>女</td><td>陕西西安</td></tr>
          <tr><td><input type="checkbox" name="ra" id="Radio3" /></td><td>赵六</td><td>男</td><td>dfdsfdsf</td></tr>
     </tbody>
   </table>
</body>
</html>
当我把checkbox改成radio效果是可以的,,请问代码怎么修改

解决方案 »

  1.   

    哦。。看清楚了。。是直接现在的效果。。把前面checkbox换成radio?radio是要单选还是多选》?
      

  2.   


    <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>无标题页</title>
    <style type="text/css">
        .odd
        {
          background:#fafafa;
        }
        .even
        {
            background:#f0f0f0;
        }
        table
        {
             border:0;
              border-collapse:collapse;<%--合并单元格--%>
        }
        th,td
        {
            width:100px;
            text-align:left;
        }
        .selected
        {
            background:blue;
        }
    </style>    <script src="jquery-1.3.2-vsdoc.js" type="text/javascript"></script>
        <script type="text/javascript">
               $(function() {
                $("tbody>tr:odd").addClass("odd"); //先排除第一行,然后给奇数行添加样式
                $("tbody>tr:even").addClass("even"); //先排除第一行,然后给偶数行添加样式
                $('tbody>tr').click(function() {
                    $(this)
                        .addClass('selected')
                        .siblings().removeClass('selected')
                        .end()
                        .find("input[name='aa']").attr("checked"); //记住要加name属性            });
                });    </script>
        
    </head>
    <body>
         <form id="form1" name="form1" runat="server">
          <table>
         <thead>
            <tr><th></th><th>姓名</th><th>性别</th><th>暂住地</th></tr>
         </thead>
         <tbody>
        
              <tr><td><input id="Radio4" type="radio" name="aa"/></td><td>张三</td><td>女</td><td>湖南长沙</td></tr>
              <tr><td><input id="Radio1" type="radio"  name="aa"/></td><td>李四</td><td>男</td><td>湖北武汉</td></tr>
              <tr><td><input id="Radio2" type="radio"  name="aa"/></td><td>王五</td><td>女</td><td>陕西西安</td></tr>
              <tr><td><input id="Radio3" type="radio"  name="aa"/></td><td>赵六</td><td>男</td><td>dfdsfdsf</td></tr>
         </tbody>
       </table>    </form>
    </body>
    </html>