JQurey复选框全选/反选
2016-12-19 12:00
197 查看
HTML布局
<form action=""> <input type="checkbox" name="items" value="篮球">篮球</input> <input type="checkbox" name="items" value="足球">足球</input> <input type="checkbox" name="items" value="排球">排球</input> <input type="checkbox" name="items" value="网球">网球</input> <br/> <input id="selectAll" type="button" value="全选"/> <input id="selectAllNo" type="button" value="全不选"/> <input id="invers" type="button" value="反选"/> <input id="submit" type="button" value="提交"/> </form>
JS
$(function(){ //获取名称为items的所有checkbox var checkboxList = $('[name=items]:checkbox') //全选操作 $("#selectAll").click(function(){ checkboxList.attr('checked','true'); }); //全不选 $("#selectAllNo").click(function(){ checkboxList.attr('checked','false'); }); //反选 $("#invers").click(function(){ checkboxList.each(function(){ this.checked = !this.checked; }); }); //提交选项 $("#submit").click(function(){ var checkedArr = new Array(); checkboxList.each(function(){ if(this.checked == true){ checkedArr.push(this.value); } }); alert(checkedArr.join('-')); }); });
相关文章推荐
- jquery的checkbox,radio,select等方法小结
- jQuery根据ID获取input、checkbox、radio、select的示例
- jquery实现的代替传统checkbox样式插件
- C#获取动态生成的CheckBox值
- C#遍历得到checkboxlist选中值和设置选中项的代码
- Android控件之CheckBox、RadioButton用法实例分析
- ASP.NET中 CheckBox复选框控件的使用
- 在ASP.NET 2.0中操作数据之五十:为GridView控件添加Checkbox
- asp.net动态产生checkbox(数据源为DB或内存集合)
- asp.net gridview中用checkbox全选的几种实现的区别
- asp.net treeview checkbox 相关问题
- IE中checkbox在刷新后初始化的问题
- javascript中checkbox使用方法简单实例演示
- 浅谈checkbox的一些操作(实战经验)
- asp.C#实现图片文件与base64string编码解码
- javascript中checkbox使用方法实例演示
- 多个datatable共存造成多个表格的checkbox都被选中
- javascript使用shift+click实现选择和反选checkbox的方法
- 微信小程序(十五)checkbox组件详细介绍
- JS选中checkbox后获取table内一行TD所有数据的方法