复选框为checkbox对象

通过input就可以将一个简单的复选框呈现在页面上

要实现的大概就是这样一个页面

 

思路

全选

因为要得到复选框数组，而id又不能重复。所以通过name来得到复选框数组。得到数组后遍历，将所有checked值设置为true即可实现全选，全不选原理相同

反选

同样的方法得到复选框数组，遍历的时候判断如果checked值为true则改为false，checked值为false则改为true

最上面的全选/全不选功能

通过id获得最上面的复选框，判断其checked值若为true则将所有的复选框设置为true,为false则设置为false

注意

为什么不是true的时候设置为false呢？因为当点击的时候复选框已发生变化，这个时候，下面的复选框应该是与上面一致的

源代码如下

1  2  3  4  5     
      6      7  8     11 12 13 14     全选/全不选15     
16     篮球17     
18     排球19     
20     羽毛球21     
22     乒乓球23     
24     25     26     27 28     71 72 73 74 

 

 

例子2 

1   2   3   4 
       5           6         156     157     158          159         
     
      160         你爱好的运动是？
      全选/全不选 161          162         
      
163         
      足球164         
      篮球165         
      羽毛球166         
      乒乓球167         
      
168         
      169         
      170         
      171         
      172     
     
173     174