jQuery实现复选框的全选和全不选
2018-02-03 18:19
344 查看
jQuery实现复选框的全选和全不选
效果如图:代码如下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>jQuery实现复选框的全选和全不选</title> </head> <body> <label><input type="checkbox" name="checkall" />全选</label> <br><br> <label><input type="checkbox" name="checkbox" />复选框1</label> <label><input type="checkbox" name="checkbox" />复选框2</label> <label><input type="checkbox" name="checkbox" />复选框3</label> <label><input type="checkbox" name="checkbox" />复选框4</label> <label><input type="checkbox" name="checkbox" />复选框5</label> <!-- 引入jQuery官方类库 --> <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script> <!-- start 全选/全不选 --> <script type="text/javascript"> $('input[name="checkall"]').on("click",function(){ if($(this).is(':checked')){ $('input[name="checkbox"]').each(function(){ $(this).prop("checked",true); }); }else{ $('input[name="checkbox"]').each(function(){ $(this).prop("checked",false); }); } }); </script> <!-- end 全选/全不选 --> </body> </html>
相关文章推荐
- jQuery实现点击复选框即高亮显示选中行 全选、反选
- 基于jquery实现复选框全选,反选,全不选等功能
- jquery实现复选框的全选操作
- JQuery 中 实现复选框全选/全不选/反选功能 案例
- jquery怎么实现全选复选框
- jQuery实现复选框 全选、反选、全不选
- jQuery实现复选框全选/全部取消/反选/获得选择的值
- jquery实现复选框打勾全选,其中一个子复选框不勾中,则不全选。所有子复选框全勾中则又全选。
- 基于jQuery实现复选框的全选 全不选 反选功能
- 用jquery实现复选框全选全不选问题(完整版),在网络上怎么也找不到完整的解决方案,重要搞全了
- Jquery实现复选框的全选
- 选中实现jquery实现复选框checkbox全选(完善)
- jQuery实现复选框 全选、反选、全不选
- jquery 实现复选框 全选/反选
- jquery实现复选框(checkbox)的全选与反选
- jQuery实现复选框全选功能
- jQuery实现复选框全选和反选,单选和多选
- jquery实现checkbox复选框的全选反选
- bootstrap+jQuery 实现下拉菜单中复选框全选和全不选效果
- 天易20----jquery实现复选框的全选与全不选功能