jquery菜单选择

html页面：

<button type='button' class='button' 
		onMouseOver="this.className='button_over';" 
		onMouseOut="this.className='button';" 
		onClick="SelectAllBox()">
		<img src="./button/quanbuxz.png" border='0' 
		align='absmiddle'> 全部选中</button>
	<button type='button' class='button' 
	<span style="white-space:pre">	</span>onMouseOver="this.className='button_over';" 
		onMouseOut="this.className='button';"  
	        onClick="UnSelectAllBox()">
	        <img src="./button/quanbubxz.png" border='0' 
	        align='absmiddle'> 全部不选中</button>
	<button type='button' class='button' 
		onMouseOver="this.className='button_over';" 
		onMouseOut="this.className='button';"  
		onClick="document.ActionForm.submit();">
	        <img src="./button/baocun.png" border='0' 
	        align='absmiddle'> 保存</button>
	<button type='button' class='button' 
		onMouseOver="this.className='button_over';" 
		onMouseOut="this.className='button';"  
	        onClick="parent.close();">
	        <img src="./button/guanbi.png" border='0' 
	        align='absmiddle'> 关闭</button>

菜单项：

<fieldset style='padding:5px;clear:left;'>
	          <legend><input type='checkbox' class='checkbox' name='menuModule' 
			  		value='company,company' id='company_company' 
					onClick='goSelect(this.id)' title="客户管理" >客户管理
	          </legend>
	            <div><input type='checkbox' class='checkbox' name='menuModule' 
	                 value='company,base'
	                        id='company_base' onClick='goSelect(this.id)' 
	                        title='客户拜访'>客户拜访</div>
	            <div><input type='checkbox' class='checkbox' name='menuModule' 
	                 value='company,linkMan'
	                        id='company_linkMan' onClick='goSelect(this.id)' 
	                        title='联系人列表'  >联系人列表</div>
	            <div><input type='checkbox' class='checkbox' name='menuModule' 
	                 value='company,linkTouch'
	                        id='company_linkTouch' onClick='goSelect(this.id)' 
	                        title='联系记录列表'  >联系记录列表</div>
	         
	            <div><input type='checkbox' class='checkbox' name='menuModule' 
	                 value='company,rule'
	                        id='company_rule' onClick='goSelect(this.id)' 
	                        title='客户查重设置 '>客户查重设置 </div>
	   </fieldset>

js代码：

<script language="javascript">
	//全选中
	function SelectAllBox(){
		$("input[name=menuModule]").attr("checked","checked");
	}
	
	//全部不选中
	function UnSelectAllBox(){
		$("input[name=menuModule]").attr("checked",null);
	}
	
    function goSelect(id){
	 //获取到的值以","分割
	 var menuModule=$("#"+id).val();
	 var array=menuModule.split(",");
	 //alert(array[0]+"     "+array[1]);
		
	 //分割的值不同，说明是子节点
     if (array[0] != array[1]) {
		/**如果一个子节点处于选中状态，那么父节点也要为选中状态**/
		if($("#"+id)[0].checked){
			//拼凑父节点的id，因为父节点的**_**是相同的
			var superid=array[0]+"_"+array[0];
			//设置父节点为选中状态
			$("#"+superid).attr("checked","checked");
		}else{
			/**如果是子节点取消操作，那么就先要判断是否还是其他子节点是选中的
			   如果其他是选中的，那么父节点的选中状态就不用取消，否则，取消父节点的选中状态**/
			var flag=false;
		   //得到其他子节点，除去本节点以外
		    var $sub=$("input[name=menuModule][value^="+array[0]+"]:not([value$="+array[0]+"])") 
		    //* 遍历所有的子节点，检查有没有其他选中的
		    $sub.each(function(index,domEle){
				if(domEle.checked){
				  	 flag=true;
				}	  
			});
		    //* 如果都没有被选中,则父节点处于不选中状态.
		    if(!flag){
		   	  	//组织父id
		        var superid=array[0]+"_"+array[0];
		        $("#"+superid).attr("checked",null);
		    }
		    //* 如果至少有一个被选中,则父节点处于选中状态.
		    if(flag){
		    	//不管
		    }
		}
	  }
	
	 /** 如果操作是父节点**/
     if (array[0] == array[1]) {
	    //* 如果父节点处于选中状态,则子节点处于选中状态.
		if($("#"+id)[0].checked){
           $("input[name=menuModule][value^="+array[0]+"]:not([value$="+array[0]+"])")
		   		.attr("checked","checked");
		}else{
		//* 如果父节点处于不选中状态,则子节点处于不选中状态.
           $("input[name=menuModule][value^="+array[0]+"]:not([value$="+array[0]+"])")
		   		.attr("checked",null);
		}
	 }
   }
</script>

效果图：

修改了小小注释：

代码来自：冯威_AJAX视频教程_jquery处理权限