本人菜鸟,网上搜了很多,感觉都不符合我的需求,特来此发帖求助。
有一个table,table中每行有2个checkbox列,其他列都是些基本信息,包括学生姓名,学生成绩等等。
要求选中某行的一个checkbox,可以得到该行其他列的数据,如该行的学生姓名,学生成绩等等,同时该行的另外一个checkbox要不选中。

解决方案 »

  1.   

    代码如下
    <table>
        <tr>
        <td>学生姓名</td>
        <td>学生成绩</td>
        <td>有效<input type="checkbox"  id="yesheader" /></td>
        <td>无效<input type="checkbox"  id="noheader" /></td>
        </tr>
        <tr>
        <td>王</td>
        <td>80</td>
        <td><input  type="checkbox" value="0" name="yes_1"  /></td>
        <td><input  type="checkbox" value="1" name="no_1"  /></td>
        </tr>
        <tr>
        <td>张</td>
        <td>90</td>
        <td><input type="checkbox" value="0" disabled="true" name="yes_2"/></td>
        <td><input  type="checkbox" value="1" name="no_2"  /></td>
        
        </tr>
        <tr>
        <td>李</td>
        <td>80</td>
        <td><input type="checkbox" value="0" name="yes_3"/></td>
        <td><input  type="checkbox" value="1" name="no_3"  /></td>
        
        </tr>
        </table>
      

  2.   


    $(function () {
    $("[type=checkbox]").on("click",function () {
    var $this= $(this), that= this;
    var checked = $this.prop("checked");
    var tr= $this.parents("tr")[0];
    $("[type=checkbox]",tr).each(function(){
    if(this != that){
    $(this).prop("checked", !checked);
    }
    });
    });
    });
      

  3.   


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
    $(function(){
    $("#abv").click(function(){
    $("table tr td input[type='checkbox']:checked").each(function(i,j){
    var ar=new Array();
    ar.push($(this).parents('tr').children('td').eq(0).text(),$(this).parents('tr').children('td').eq(1).text());
    alert(ar);
    });
    });
    });
     </script>
     <input type="button" id="abv" value="测试用按钮"/>
     <table>
         <tr>
         <td>学生姓名</td>
         <td>学生成绩</td>
         <td>有效<input type="checkbox"  id="yesheader" /></td>
         <td>无效<input type="checkbox"  id="noheader" /></td>
         </tr>
         <tr>
         <td>王</td>
         <td>80</td>
         <td><input type="checkbox" value="0" name="yes_1"  /></td>
         <td><input type="checkbox" value="1" name="no_1"  /></td>
         </tr>
         <tr>
         <td>张</td>
         <td>90</td>
         <td><input type="checkbox" value="0" disabled="true" name="yes_2"/></td>
         <td><input type="checkbox" value="1" name="no_2"  /></td>
         
         </tr>
         <tr>
         <td>李</td>
         <td>80</td>
         <td><input type="checkbox" value="0" name="yes_3"/></td>
         <td><input type="checkbox" value="1" name="no_3"  /></td>
         
         </tr>
         </table> 
      

  4.   

    谢谢楼上的2位,但如何选中其中一个checkbox,将另外一个不选中呢。比如某行的有效框原本选中,然后点击该行的无效框,有效框就没选中了,求解
      

  5.   


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
    $(function(){
    $("#abv").click(function(){
    $("table tr td input[type='checkbox']:checked").each(function(i,j){
    var ar=new Array();
    ar.push($(this).parents('tr').children('td').eq(0).text(),$(this).parents('tr').children('td').eq(1).text());
    alert(ar);
    });
    });
    $("table tr td input[type='checkbox']").click(function(){
    $(this).parents('tr').children('td').find('input').not(this).attr("checked",false);
    });
    });
     </script>