checkbox 选中问题

[sking_2008]

口A 口B 口C
|
口D 口E 口F
|
口a 口b


我想实现的 功能是:
A的 复选框 默认为灰色不可选,D,E,F是他们子复选款的全选复选框
只要在选中 D,E,F 或他们下面的子复选框的时候(哪怕只选中一个) A的复选框就默认被选中

简单一句话 就是我点击任何一个子复选框(D 级别 或 a级别的) 都会导致 父复选框(A 级别的)被程序控制选中

现在 分组全选的js写出来了 但是 选中一个 灰色复选框 被选中的就不会了..麻烦大家帮帮忙了

[Arc365]

[Quote=引用 5 楼 Ghost_520 的回复:]

上面的代码有点小 bug ，逻辑有点问题，如果有多个子复选框就会判断有误，下面这段代码已经解决此逻辑错误，共有 4处修改地方。


HTML code

  <input id='checkboxA' type='checkbox' value='A' disabled='true'>A</input>        
           
<input id='checkboxB' type='checkbox' value='B' disabled='true'>B</input>  
<input id='checkbox…
[/Quote]

楼上的，你先选中E，再选中F，然后再取消选择F，看看是什么效果

[Arc365]

我感觉如果这样做的话，最好checkbox的命名有一定的规则，
比如说：
A: A
D: A_D E: A_D F: A_F
a: A_D_a b: A_D_b
然后使用这个规则来判断一下，是不是父结点或子结点

[Ghost_520]

[Quote=引用 6 楼 Arc365 的回复:]
引用 5 楼 Ghost_520 的回复:

上面的代码有点小 bug ，逻辑有点问题，如果有多个子复选框就会判断有误，下面这段代码已经解决此逻辑错误，共有 4处修改地方。


HTML code

  <input id='checkboxA' type='checkbox' value='A' disabled='true'>A </input>        
           
<input id='checkboxB' type='checkbox' value='B' disabled='true'>B </i…
[/Quote]

呵呵，还真有这个问题，不过解决了。

  <input id='checkboxA' type='checkbox' value='A' disabled='true'>A</input>         
           
<input id='checkboxB' type='checkbox' value='B' disabled='true'>B</input>  
<input id='checkboxC' type='checkbox' value='C' disabled='true'>C</input>
<BR/>
  <input name='parentA1' type='checkbox' value='D' onclick="selectCheckBox(this, 'checkboxA', 'parentA1','parentA2')">D</input>   
<input name='parentA1' type='checkbox' value='E' onclick="selectCheckBox(this, 'checkboxA', 'parentA1','parentA2')">E</input>   
<input name='parentA1' type='checkbox' value='F' onclick="selectCheckBox(this, 'checkboxA', 'parentA1','parentA2')">F</input>   
<BR/>
  <input name='parentA2' type='checkbox' value='a' onclick="selectCheckBox(this, 'checkboxA', 'parentA1', 'parentA2')">a</input>   
<input name='parentA2' type='checkbox' value='b' onclick="selectCheckBox(this, 'checkboxA', 'parentA1', 'parentA2')">b</input>   
<script>
  function selectCheckBox(selectId ,parentCheck, sonCheckName1 ,sonCheckName2){
       var arr1=document.getElementsByName(sonCheckName1);  // 第一个子节点下的所有复选框
	   var arr2 = document.getElementsByName(sonCheckName2);  // 第二个子节点下的所有复选框
	   
	   // 将所有的子节点复选框存在 array 里面，以便检索所有的子节点复选框
	   var array = new Array();
	   array[0] = arr1;
	   array[1] = arr2;

	   var parentCheck = document.getElementById(parentCheck);  // 对应的父节点

	   if(selectId.checked==true){
			// 当这个节点被选中时，父节点同时被选中
			parentCheck.checked=true;
	   }else{
			// 如果没有被选中，则判断是否有其他子节点的复选框被选中
			var flag = false;  //  这里不能放在循环里面 
			for(var j=0;j<array.length;j++){
				
				var arr = array[j];
				
				if(flag && j==(array.length-1)){
					// 如果有子节点的复选框被选中，且所有子节点的复选框已检索完毕，则跳出循环
					break;
				}else if(!flag && j==(array.length-1)){
					//  如果所有子节点的复选框已检索完后 flag == false，则表示没有一个子节点复选框被选中，则父节点的复选框也不会被选中
					parentCheck.checked=false;
				}
				for(var i=0;i<arr.length;i++){
					if(arr[i].checked == true){
						parentCheck.checked=true;
						// 如果有子节点的复选框被选中，则跳出此循环
						flag = true;
					}
                                        // 这里不要 else 的操作就可以了。
				}
			}
	   }
  }
</script>

[Ghost_520]

Arc365 ，你再找找，还有错误么？ 呵呵。

[suncheng_hong]

js 慢慢写吧

[Ghost_520]

[Quote=引用 7 楼 Arc365 的回复:]
我感觉如果这样做的话，最好checkbox的命名有一定的规则，
比如说：
A: A
D: A_D E: A_D F: A_F
a: A_D_a b: A_D_b
然后使用这个规则来判断一下，是不是父结点或子结点
[/Quote]

你说的是给每个 checkbox 给定一个 id 吧，我觉得这里不能用 id ，只能用name ，给每一组子复选框同一个 name ，

在js里面就可以只用 getElementsByName 获得该组所有的复选框。楼主已经说过了，它会有 N 个复选框，按你那么命名的话，

多了的话，会不会非常麻烦？

[sking_2008]

首先 特别感谢大家的帮助 但是现在有一个问题D 是 a和 b 的全选复选框 即 点击 D的话 a 和b 是要被全选的
这样的需有的 checkbox都用了同意名字 貌似就 难以实现 分组全选的功能了
看看 大家还有没有什么 好主意

[sking_2008]

怪我了 眼睛穿花了 ..... Ghost_520 的代码 好像是可以实现的. 马上该去. 该好了接帖子

[Ghost_520]

怎么不行了，代码是万能的。

[sking_2008]

还有个问题 我的 abcdef 这些 checkbox的name 都是通过 循环 得来的 那怎么把所有的 name 一起都传到 js中?

[Ghost_520]

[Quote=引用 15 楼 sking_2008 的回复:]
还有个问题 我的 abcdef 这些 checkbox的name 都是通过 循环 得来的 那怎么把所有的 name 一起都传到 js中?
[/Quote]

你循环也有个规律吧？

[Ghost_520]

循环的话，正好可以按照上面的写法存在 Array 里面。

今天下班了，明天再来帮你解决啊，呵呵。

[sking_2008]

[Quote=引用 18 楼 Ghost_520 的回复:]

楼主，请把问题总结下，我都不知道还有没有问题了。
[/Quote]

<input name='parentA1' type='checkbox' value='D' onclick="selectCheckBox(this, 'checkboxA', 'parentA1','parentA2')">D</input>   

input 是循环出来的 也就是说 D E F(二级目录)是循环出来的 那么也许我A 下面有3个二级目录 B下面可能有5个二级目录.那么问题就在于 selectCheckBox()这个方法里面传入的 参数可以是动态的么?
或者selectCheckBox(Arr[]) 我直接把 会话中的list放到里面可以么?

[Ghost_520]

试试。。

// 生成 checkbox ：
  <%
     for(int i=0;i<list.size();i++){
  %>
  
       <input name="parentA<%=i%>" ... onclick= "selectCheckBox(this,'checkboxA',list.size())">..</input>
  <%   } %>
  
 function selectCheckBox(selectId ,parentCheck, sonCheckBoxlength){
       
       // 将所有的子节点复选框存在 array 里面，以便检索所有的子节点复选框
       var array = new Array();
      for(var i=0;i<sonCheckBoxlengthi++){
          var sonCheckBoxS=document.getElementsByName("parentA"+i);  
            array[i] = sonCheckBoxS;
      }
      ......   // 下面的做法类似
  }

[Ghost_520]

楼主，请把问题总结下，我都不知道还有没有问题了。

[lili830209]

帮顶

[pushregistration]

帮顶

[zhaokaide]

checkbox首先要把有关checkbox的属性跟一些基本的js方法弄明白
然后在根据自己需要的去设计思路,不然这次会了,下次有得找....

[zhaokaide]

checkbox首先要把有关checkbox的属性跟一些基本的js方法弄明白
然后在根据自己需要的去设计思路,不然这次会了,下次有得找....

[Arc365]

[Quote=引用 9 楼 Ghost_520 的回复:]

Arc365 ，你再找找，还有错误么？ 呵呵。
[/Quote]

呵呵 ，今天 公司 网络 断了，上不了网。。。
明天有时间再看看