jquery實作控製表格行高亮實例_jquery

[css]

複製程式碼 程式碼如下:

程式碼如下:

  background:#666666;   /*背景顏色為灰色*/
}
tr{
    cursor: pointer; >

[html] 

複製代碼 代碼如下:

   姓名性別居住地
   ;
        張三 男< ;td>北京
   ;
    ;
        李四 男Han td>
   ;
    ;
        王五 女深圳
   ;
    ;
        趙六 女< ;td>北京
   ;
    ;
孫七 男< ;td>上海
;
表>
身體>

   姓名性別居住地
  
       
  
   
       
   tr>
            深圳
  
   
       
  
   
        上海
  

	張三	男 td>	北京
李四	男	上海
	王五	女
			女	北京
	孫七	男

身體>

jquery

[javascript]

複製程式碼程式碼如下：

 plaincopyprint?$(document).ready(function(){
       //第一種寫法: $("tr:gt(0)")   第一行標題不起作用$("tr:gt(0)").click(function(){
              $(this).addClass("height").siblings().removeClass("height").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)."height").siblings().removeClass("height").end). (":radio").attr("checked",true);
       })*/
})

$(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);
    })*/
})