举了7个不同的checkbox状态，和大家一一分享。

1、全选

$("#btn1").click(function(){

$("input[name='checkbox']").attr("checked","true");

})

2、取消全选（全不选）

$("#btn2").click(function(){

$("input[name='checkbox']").removeAttr("checked");

})

3、选中所有奇数

$("#btn3").click(function(){

$("input[name='checkbox']:odd").attr("checked","true");

})

4、选中所有偶数

$("#btn6").click(function(){

$("input[name='checkbox']:even").attr("checked","true");

})

5、反选

$("#btn4").click(function(){

$("input[name='checkbox']").each(function(){

if($(this).attr("checked"))

{

$(this).removeAttr("checked");

}

else

{

$(this).attr("checked","true");

}

})

})

或者

$("#invert").click(function(){

  $("#ruleMessage [name='delModuleID']:checkbox").each(function(i,o){

   $(o).attr("checked",!$(o).attr("checked"));

  });

 });

6、获取选择项的值

var aa="";

$("#btn5").click(function(){

$("input[name='checkbox']:checkbox:checked").each(function(){

aa+=$(this).val()

})

document.write(aa);

})

})

7、遍历选中项

$("input[type=checkbox][checked]").each(function(){

 //由于复选框一般选中的是多个,所以可以循环输出

 alert($(this).val());

});

下面实例讲述了jquery实现全选、反选、获得所有选中的checkbox。分享给大家供大家参考。具体如下：
运行效果截图如下：

具体代码如下：

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title>无标题页</title>

<script src="js/jquery-1.6.min.js" type="text/javascript"></script>

<script type="text/javascript">

jQuery(function($){

//全选

$("#btn1").click(function(){

$("input[name='checkbox']").attr("checked","true");

})

//取消全选

$("#btn2").click(function(){

$("input[name='checkbox']").removeAttr("checked");

})

//选中所有基数

$("#btn3").click(function(){

$("input[name='checkbox']:even").attr("checked","true");

})

//选中所有偶数

$("#btn6").click(function(){

$("input[name='checkbox']:odd").attr("checked","true");

})

//反选

$("#btn4").click(function(){

$("input[name='checkbox']").each(function(){

if($(this).attr("checked"))

{

$(this).removeAttr("checked");

}

else

{

$(this).attr("checked","true");

}

})

})

//或许选择项的值

var aa="";

$("#btn5").click(function(){

$("input[name='checkbox']:checkbox:checked").each(function(){

aa+=$(this).val()

})

document.write(aa);

})

})

</script>

</head>

<body>

<form id="form1" runat="server">

<div>

<input type="button" id="btn1" value="全选">

<input type="button" id="btn2" value="取消全选">

<input type="button" id="btn3" value="选中所有奇数">

<input type="button" id="btn6" value="选中所有偶数">

<input type="button" id="btn4" value="反选">

<input type="button" id="btn5" value="获得选中的所有值">

<br>

<input type="checkbox" name="checkbox" value="checkbox1">

checkbox1

<input type="checkbox" name="checkbox" value="checkbox2">

checkbox2

<input type="checkbox" name="checkbox" value="checkbox3">

checkbox3

<input type="checkbox" name="checkbox" value="checkbox4">

checkbox4

<input type="checkbox" name="checkbox" value="checkbox5">

checkbox5

<input type="checkbox" name="checkbox" value="checkbox6">

checkbox6

<input type="checkbox" name="checkbox" value="checkbox7">

checkbox7

<input type="checkbox" name="checkbox" value="checkbox8">

checkbox8

</div>

</form>

</body>

</html>

（转载）jquery实现全选、反选、获得所有选中的checkbox的更多相关文章

  1. python: jquery实现全选 反选 取消

    引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...

  2. jquery 书写全选反选功能

    书写一个后台管理中用到的全选反选功能.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  3. jquery实现全选/反选功能

    <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...

  4. jQuery实现全选/反选和批量删除

    <%@ page language="java" contentType="text/html; charset=utf-8"     pageEncod ...

  5. 基于JQ的多选/全选/反选及获取选中的值

    <!-- author:青芒 --> <!DOCTYPE html> <html lang="en"> <head> <met ...

  6. ----Juquery复选框全选反选及获取选中值Value

    --获取选中值 var pList = ""; $("[name='ckdProd']").each(function () { if ($(this).is( ...

  7. jQuery实现全选反选功能

    废话不说,直接上代码! <html> <head> <meta http-equiv="Content-Type" content="tex ...

  8. jquery 实现全选反选

    jquery代码 $(function () { $('#inputCheck').click(function () { if ($(this).attr("checked")) ...

  9. jquery实现全选 反选 取消

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. SparkSql实现Mysql到hive的数据流动

    今天去面试了一波,因为调度系统采用了SparkSql实现数据从Mysql到hive,在这一点上面试官很明显很不满我对于Spark的理解,19年的第一个面试就这么挂了. 有问题不怕,怕的是知道了问题还得 ...

  2. print(dir(...)) 打印对象或者类中的方法和函数

  3. Subversion、TortoiseSVN、Ankhsvn+VS使用

    Subversion为版本控制软件的服务器端.VisualSVN Server 可以在Windows平台安装和管理全功能的Subversion server. TortoiseSVN为Subversi ...

  4. HDFS下载数据机制的底层分析

    HDFS下载数据机制的底层分析 Hadoop中的RPC(Remote Procedure Call)框架 hadoop中结点间的通信采用的是RPC. RPC框架的实现机制图解: 从hdfs下载数据的源 ...

  5. 在windows下的hdfs客户端编写

    在windows下的hdfs客户端编写 新建一个工程,右键 properties -> java build path -> libraries 和之前一样的操作,这次 new 一个 us ...

  6. 两周以来的学习成果&遇到的问题及解决：

    1.学习java的基本内容,看慕课网上的java入门三季,与韩顺平老师的java视频 刚开始是看韩顺平老师的视频,边看边实战,内容很细,也很快熟练,但是进度太慢.后来就先看了慕课网上的java 入门的 ...

  7. Alpha 冲刺报告（3/10）

    Alpha 冲刺报告 队名:洛基小队 峻雄(组长) 已完成:开始编写角色的移动脚本 明日计划:继续学习并进行脚本编写 剩余任务:物品背包交互代码 困难:如何把各个模块的脚本整合起来 --------- ...

  8. iOS AOP框架Aspects实现原理

    总结: Aspects 是对 类的继承结构isa.mataclass结构的调整和维护:相当于链表的节点插入和删除: 同时使用method Swizzling 对方法统一重定向: 同时使用类似代理的机制 ...

  9. shell基础--test命令的使用

    test :用于文件类型检查和变量比较 一.用途: 1.判断表达式 2.判断字符串 3.判断整数 4.判断文件 测试例子: (1).test [root@~_~ day5]# cat test.sh ...

  10. 第一章 进入java的世界

    一.你要做的事情: 1.  编写源代码:xxx.java 2. 编译器编译:检测代码错误 3. 输出:编译器输出xxx.class 4. 运行:java虚拟机运行xxx.class