第一步：编写前端页面test.html，JQuery核心文件jquery.js见附件
<head>
<title>JQuery实现checkbox的全/不全选，以及反选功能</title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="text.js"></script>
</head>
<body>
<input type="button" id="sel" value="全选" />
<input type="button" id="dissel" value="反选" />
<input type="checkbox" value="1" />CheckBox1
<input type="checkbox" value="2" />CheckBox2
<input type="checkbox" value="3" />CheckBox3
<input type="checkbox" value="4" />CheckBox4
</body>
</html>
第二步：编写text.js文件
$(function(){
var checkboxs = $("input[type='checkbox']");
var flag = true;
$("#sel").click(function(){
if($("#sel").val()=="不全选"){
$("#sel").val("全选");
flag = false;
}else{
$("#sel").val("不全选");
flag = true;
}
checkboxs.each(function(){
flag?$(this).attr("checked",true):$(this).removeAttr("checked");
});
});
$("#dissel").click(function(){
checkboxs.each(function(){
$(this).attr("checked")?$(this).removeAttr("checked"):$(this).attr("checked",true);
});
});
});
分享到：
相关推荐
jQuery实现复选框checkbox的全选与反选功能，不用多介绍了吧，以往都是基于纯js的实现比较多，这个是引入了jquery，或许更能满足现在的前端设计吧。
页面上通过一个checkbox实现全选与反选
Jquery全选反选Checkbox 简单好用 复用性很好 欢迎下载
jquery、js操作checkbox全选反选.docx
jQuery有些版本中实现CheckBox全选/全不选/反选会有bug，经测试jquery-1.3.1.js–>测试通过，jquery-1.5.1.js–>测试不通过。 实现CheckBox全选/全不选/反选代码如下： <%@ page language="java" ...
我们在做列表的时候经常会遇到全选，反选进行批量处理问题，例如： 我当时就是简单的实现了，然后想封装到公共的js中，封装的太烂，不好意思贴出来了（就是把实现代码之间放到公共js中，然后每个页面都用固定的id...
NULL 博文链接：https://xdwangiflytek.iteye.com/blog/1343416
为了让大家更好的理解,我直接把实现功能的代码贴出来: 代码如下:$(“#myform”).toggleCheckboxes()//全选,取消全选,反选 $(“#myform”).toggleCheckboxes(“:not(#checkbox1)”)//全选,取消全选且不选中第一个,...
jquery实现checkbox全选、反选、全部选，很不错的资源，欢迎大家下载学习var langType=""; var arLangType = []; $("[name='langType'][checked]").each(function(i) { arLangType[i]=$(this).val(); }); ...
使用jquery实现 checkbox的 全选，反选
jquery Checkbox 全选 反选 全不选 多种实现方法 和表单验证
checkbox使用jquery全选-反选-取得选中的值-完整的例子
用JavaScript使页面上的一组checkbox全选/取消全选，逻辑很简单，实现代码也没有太难的语法。但使用jQuery实现则更简单，代码也很简洁，精辟！
用jquery实现的checkbox全选和反选代码,需要的朋友可以参考下。
2、取消全选（全不选） $("#btn2").click(function(){ $("input[name='checkbox']").removeAttr("checked"); }) 3、选中所有奇数 $("#btn3").click(function(){ $("input[name='checkbox']:odd").attr("check
主要介绍了js与jQuery实现checkbox复选框全选/全不选的方法,结合实例较为详细的分析了JavaScript与jQuery针对checkbox复选框全选与反选的操作技巧,需要的朋友可以参考下
jquery attr()方法获取标签的 checked 会有问题，所以用了 prop() 方法。 Hml的checkbox没有加name，只用了 div 嵌套。 如有更好的方法，望指点!! //全选 $('#allChecked').change(function(){ $('#box').children...