复选框全选

1.前端需要使用到全选操作

<input type="checkbox" id="all">

<input class="checkbox" type="checkbox" name="checkedItem" value="[id]">

2.两种方法实现

Checkbox 对象的属性

属性描述accessKey设置或返回访问 checkbox 的快捷键。alt设置或返回不支持 checkbox 时显示的替代文本。checked设置或返回 checkbox 是否应被选中。defaultChecked返回 checked 属性的默认值。disabled设置或返回 checkbox 是否应被禁用。form返回对包含 checkbox 的表单的引用。id设置或返回 checkbox 的 id。name设置或返回 checkbox 的名称。tabIndex设置或返回 checkbox 的 tab 键控制次序。type返回 checkbox 的表单元素类型。value设置或返回 checkbox 的 value 属性的值

2.1.方法一

<script type="text/javascript">$("#all").click(function(){       if(this.checked){       $('.checkbox').prop("checked",true);    }else{       $('.checkbox').prop("checked", false);    }   });</script>

2.2.方法二

<script type="text/javascript">$(function() {$("#all").change(function() {//判断全选框的改变var flage = $(this).is(":checked");//全选选中为true，否则为false$("input[type=checkbox]").each(function() {$(this).prop("checked", flage);})})})</script>

3.总结

方法一是直接判断总复选框是否选中来改变子复选框的属性，总复选框选中则子复选框选中

方法二是根据总复选框是否被选中来判断true和false，再把true和false赋给子复选框，改变他的属性

两种本质一样