Jquery checkbox級聯選擇 -- 通用型

/*
	checkbox 上需要添加index字段  格式如下:父節點為1則子節點為1_1,1_2 以此類推
*/
$j(function($) {
		$(":checkbox").click(function(){
			var index = $(this).attr("index");			
			$(":checkbox[index^="+index+"]").attr("checked",$(this).is(":checked"));			
			var parent_index = index.substring(0,index.length - 2);
			$(":checkbox[index="+parent_index+"]").attr("checked",false);			
			var parentIsCheck = false;
			$(":checkbox[index^="+parent_index+"]").each(function(i){		
				if($(this).is(":checked")){
					parentIsCheck = true;
				}
			});			
			$(":checkbox[index="+parent_index+"]").attr("checked",parentIsCheck);
			var parent_parent_index = index.substring(0,parent_index.length - 2);			
			var parent_parent_is_check = false;
			$(":checkbox[index="+parent_parent_index+"]").attr("checked",parent_parent_is_check);
			$(":checkbox[index^="+parent_parent_index+"]").each(function(i){			
				if($(this).is(":checked")){
					parent_parent_is_check = true;
				}
			});			
			$(":checkbox[index="+parent_parent_index+"]").attr("checked",parent_parent_is_check);
		});
	});



關鍵在於index 這個字段 --  js代碼只不過是判定而已~~~   

<dt>
<img src="/crm/images/tree/tree_node_e_2.gif" /><img src="/crm/images/tree/folder_off.gif" />
<span class="text-g"> 
<input type="checkbox" name="functionIds" value='1' style="margin:3px 0 0;" index='1'/>
<span style="margin-left:3px">建立活動</span>
</span>
</dt>
<dt>
<img src="/crm/images/tree/tree_vert.gif" /><img src="/crm/images/tree/tree_node_n_0.gif" />
<img src="/crm/images/tree/item.gif" />
<input type="checkbox" name="functionIds" value='2' style="margin:3px 0 0;" index='1_1'/>
<span style="margin-left:3px">設定客戶群</span>:
<input type="checkbox" name="functionIds" value='3' style="margin:3px 0 0;" index='1_1_1'  />基金
<input type="checkbox" name="functionIds" value='4' style="margin:3px 0 0;" index='1_1_2'  />信用卡
<input type="checkbox" name="functionIds" value='5' style="margin:3px 0 0;" index='1_1_3'  />黃金存摺
</dt>
<dt>
<img src="/crm/images/tree/tree_vert.gif" /><img src="/crm/images/tree/tree_node_n_0.gif" />
<img src="/crm/images/tree/item.gif" />
<input type="checkbox" name="functionIds" value='6' style="margin:3px 0 0;" index='1_2'/>
<span style="margin-left:3px">訂定活動</span>:
<input type="checkbox" name="functionIds" value='7' style="margin:3px 0 0;" index='1_2_1'  />基金
<input type="checkbox" name="functionIds" value='8' style="margin:3px 0 0;" index='1_2_2'  />信用卡
<input type="checkbox" name="functionIds" value='9' style="margin:3px 0 0;" index='1_2_3'  />黃金存摺
</dt>
<dt>
<img src="/crm/images/tree/tree_vert.gif" /><img src="/crm/images/tree/tree_node_e_0.gif" />
<img src="/crm/images/tree/item.gif" />
<input type="checkbox" name="functionIds" value='10' style="margin:3px 0 0;" index='1_3'/>
<span style="margin-left:3px">活動計劃</span>
</dt>
<dt>


------------------------------------------------------------------------------------------------------------------------------------------------------------------



  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值