举了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. 铁乐学Python_day12_作业

    1.写函数,返回一个扑克牌列表,里面有52项,每一项是一个元组 例如:[('红心',2),('草花',2), -('黑桃','A')] def poker(): suit = ['红心', '梅花', ...

  2. 如何创建一个Quartz.NET的工作，需要注射autofac

    问题: 使用 Quartz.Net 做定时任务时,实现IJob对象的服务,Autofac不会自动注入,使用构造函数会直接出现异常,无法执行Execute方法. 解决方式 方法一: 使用 Autofac ...

  3. Hadoop HBase概念学习系列之HBase里的4维坐标系统（第一步定位行键 -> 第二步定位列簇 -> 第三步定位列修饰符 -> 第四步定位时间戳）（十八）

    HBase里的4维坐标系统(第一步定位行键   ->   第二步定位列簇  ->  第三步定位列修饰符   ->  第四步定位时间戳) HBase里的4维坐标系统(第一步定位行键   ...

  4. Hadoop HBase概念学习系列之优秀行键设计（十六）

    我们通过行键访问HBase.尽管使用扫描过滤器可以一次性指明大量的键,但是HBase仅仅能够根据行键识别出一行. 优秀的行键设计可以保证良好的HBase性能. 1.行键存在于HBase中的每一个单元格 ...

  5. 第八章 计时器（BEEPER2）

    /*------------------------------------- BEEPER2.C -- Timer Demo Program No.1 (c) Charles Petzold, 19 ...

  6. 结合领域驱动设计的SOA分布式软件架构

    引言 本文主要是参考Martion Fowler所著的<企业应用架构模式>与Eric Evans所著的<领域驱动设计>这两本泰山之作,加上本人在近年实际的工作过程中开发SOA系 ...

  7. ZT 输入一个字符串，查找它的第一个数字串，并返回其个数

    /*查找字符串中的数字串问题 输入一个字符串,查找它的第一个数字串,并返回其个数 */ #include <stdio.h> char firstnum(char *input,char ...

  8. jstorm知识整理

    最近在做一个jstorm的程序.我的jstorm程序消费一个kafka主题,根据数据逻辑判断需要往下游哪几个kafka主题的生产者发送. 1.bolt的execute(Tuple input)方法每次 ...

  9. CAN总线实际运用分析问题。

    组态设计   人机交互  上位机  分布式控制系统  下位机  (单片机/PLC)  CAN总线用线缆   连接方式(手牵手,T型)    CAN总线接地(大地) http://bbs.gongkon ...

  10. 【LeetCode371】 Sum of Two Integers

    题目描述: 解题思路: 此题是要在不用操作符+和-的情况下,求两个整数的和.既然不能用内置的加减法,那就只能用位运算(&, |, ~, ^). (1)异或(xor):异或的数学符号为“⊕”,计 ...