html高亮显示,控制复选框以及按钮

<form name="so_list">
	
	  <div class="list_title">
	    <!-- tab title -->
        <table class="tab_title" cellspacing="0" cellpadding="0" style="table-layout:fixed;width:100%;*width:auto;">
	      <tbody>
	        <tr>
		      <td class="borderleftnone" width="27px" valign="middle" style="padding:1px 0 1px 5px;"><input name="checkbox" type="checkbox"  id="all" onclick="CheckAll(so_list)"/></td>
		      <td valign="middle" style="width:160px;padding:0; padding-left:15px;">商家名称</td>
		      <td valign="middle" style="width:130px;padding:0; padding-left:15px;">联系人名称</td>
			  <td valign="middle" style="width:130px;padding:0; padding-left:15px;">联系人电话</td>
			  <td valign="middle" style="width:180px;padding:0; padding-left:15px;">联系人邮箱</td>			  
			  <td class="min" valign="middle" style="padding:0; padding-left:15px;">商家地址</td>
		      <td valign="middle" style="width:80px;padding:0; padding-left:15px;">状态</td>
		    </tr>
	      </tbody>
	    </table>
	  </div>
    
	  <div class="list_block" style="height:auto;overflow-x: hidden; overflow-y: auto;">
	
	    <div class="list_content">
	      <table width="101%" cellpadding="0" cellspacing="0" class="business_list" id="business_list" style="table-layout:fixed;">
	        <tbody>
	        <tr class="gl" id="gl">
		      <td valign="middle" style="width:27px;padding:1px 0 1px 5px"><input name="checkbox" type="checkbox" id="2" /></td>
		      <td valign="middle" style="width:160px;padding:0; padding-left:15px;">COCO奶茶</td>
		      <td valign="middle" style="width:130px;padding:0; padding-left:15px;">王先生</td>
			  <td valign="middle" style="width:130px;padding:0; padding-left:15px;">13566451239</td>
			  <td valign="middle" style="width:180px;padding:0; padding-left:15px;">cocoTea@126.com</td>
		      <td valign="middle" class="min" style="padding:0; padding-left:15px;"> </td>
		      <td valign="middle" style="width:80px;padding:0; padding-left:15px;">待审核</td>
		    </tr>
	        </tbody>
	      </table>
	    </div>
      </div>
    
      <div class="tooltab tooltab_bottom">
  
  	    <div class="right">
	      <a href="#">首页</a>
	      <a href="#">上一页</a>
	      <a href="#">下一页</a>
	      <a href="#">末页</a>
	      <select class="wd_80">
	      </select>
	    </div>
  
        <div class="nowrap left">
          <input id="quick_browse" class="wd_50 btn" type="button" value="浏览" name="browse">
	      <input id="quick_create" class="wd_102 btn" type="button" value="创建商家帐号" name="create">
	      <input id="quick_edit" class="wd_50btn" type="button" value="编辑" name="edit" />
		  <input id="quick_del" class="wd_50btn" type="button" value="删除" name="del" />
		  <form class="search_subject" action="">
            <input id="search_text" class="wd_200"  type="text" />
		    <input id="quick_search" class="wd_50" type="submit" value="搜索" name="search" />
	      </form>     
	    </div>
	
	    <div class="clr"> </div>
      </div>
  
    </form>

　　重要的是js

$(function(){
         //由于要控制button,所以先获取按钮数组
	var num = $(":button");
	num.click(function(){
		var j=0;
		var id;
		var check="";
                  //按钮单击,检查该行复选状态为true的,用j计数,用id捕获对象id标识
		$(":checkbox[name='checkbox'][checked=true]").each(function(){
                           //没全选计数
			if(this.id!="all"){
				j=j+1;
				id=this.id;
                                     //统计捕获的id
				check=check+","+this.id;
			}
		});
		if(this.name!="del"){
			if(j>1){
				alert("sorry！只能选择一个用户");	
			}else{
				if(j==0){
					alert("请选择一个用户");
				}else{
					if(this.name=="browse"){
						alert("浏览标识为"+id);
					}else if(this.name=="create"){
						alert("创建标识为"+id);
					}else if(this.name=="edit"){
						alert("修改标识为"+id);
					}
				}
				
			}
		}else{
			if(j==0){
				alert("请选择一个用户");
			}else{
				var ids=check.substring(1)
				alert("删除"+ids);
			}
		}
	})
	//高亮显示
	$(".gl td").click(function(){
		//单击行的复选
		var chkItem=$(this).parent().children("td").children(":checkbox[name='checkbox']");
		//复选状态
		var chkValue=chkItem.attr("checked");
		//复选加相反状态
		chkItem.attr("checked",!chkValue);
		//颜色
		var backgroundStyle=chkValue?"#F2F4F6":"#fc6";
		$(this).parent().children("td").css("background-color",backgroundStyle);		
	});
	
	$(".list_content :checkbox[name='checkbox']").click(function(){
                  //点击复选给相反checked
		var chkValue=$(this).attr("checked");		
		$(this).attr("checked",!chkValue);
	});
	//all
	$("#chkAll").click(function(){
		var flag=$(this).attr("checked");
		var backgroundStyle=flag?"#fc6":"#F2F4F6";
		if(flag){
			$(".list_content :checkbox").attr("checked",flag);
		} else {
			$(".list_content :checkbox").removeAttr("checked");
		}	
		
		$(".gl td").css("background-color",backgroundStyle);
		
	});
})