html

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8" />

		<title>复选框</title>

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

		<script type="text/javascript" src="js/test.js" ></script>

	</head>

	<body>

		<form method="post" action="">

你的爱好是:

<br />

<input type="checkbox" name="checkbox1" value="看书" />看书

<input type="checkbox" name="checkbox1" value="唱歌" />唱歌

<input type="checkbox" name="checkbox1" value="跳舞" />跳舞

<input type="checkbox" name="checkbox1" value="运动" />运动

<br />

<input type="button" id="CheckedAll" value="全 选" />

<input type="button" id="CheckedNo" value="全不选" />

<input type="button" id="CheckedRev" value="反选" />

<input type="button" id="send" value="提交" />

	</body>

</html>

　　js

$(document).ready(function(){

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

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

        })

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

        	$("[name=checkbox1]:checkbox").attr("checked",false);

        })

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

        	$("[name=checkbox1]:checkbox").each(function () {

        		this.checked=!this.checked;

        	})

        })

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

		var str = "你的爱好是:\r\n";

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

		str+=$(this).val()+"\r\n";	

			});

		alert(str);	

			});

	});

　　 效果：

jquery 实现复选框选择效果的更多相关文章

  1. 一天搞定jQuery(三)——使用jQuery完成复选框的全选和全不选

    还记得之前我使用JavaScript来实现复选框的全选和全不选效果吗?如果读者初次翻阅本文,可记得看看教你一天玩转JavaScript(七)——使用JavaScript完成复选框的全选和全不选的效果! ...

  2. 对jquery操作复选框

    摘要:jquery操作复选框.使用更简洁易懂,思路清晰,逻辑更明了,很实用 <!DOCTYPE html> <html> <head> <meta chars ...

  3. jQuery操作复选框checkbox技巧总结 ---- 设置选中、取消选中、获取被选中的值、判断是否选中等

    转载:https://blog.csdn.net/chenchunlin526/article/details/77448168 jQuery操作复选框checkbox技巧总结 --- 设置选中.取消 ...

  4. jquery操作复选框(checkbox)十二技巧

    jquery操作复选框(checkbox)的12个小技巧. 1.获取单个checkbox选中项(三种写法)$("input:checkbox:checked").val()或者$( ...

  5. jquery获取复选框checkbox的值

    jQuery API : each(callback) :以每一个匹配的元素作为上下文来执行一个函数. :checked :匹配所有选中的被选中元素(复选框.单选框等,不包括select中的optio ...

  6. jQuery取复选框值、下拉列表里面的属性值、取单选按钮的属性值、全选按钮、JSON存储、*去空格

    1.jquery取复选框的值<!--引入jquery包--> <script src="../jquery-1.11.2.min.js"></scri ...

  7. jquery判断复选框checkbox是否被选中

    jquery判断复选框checkbox是否被选中 使用is方法 //如果选中返回true //如果未选中返回false .is(':checked');

  8. jquery判断复选框是否选中

    jquery判断复选框是否被选中 $(function(){ $(document).on("click", ".checkbox",function(){ v ...

  9. jQuery判断复选框checkbox的选中状态

    通过jQuery设置复选框为选中状态 复选框 <input type="checkbox"/> 错误代码: $("input").attr(&quo ...

随机推荐

  1. Uva10491 Cows and Cars 【迁移自洛谷博客】

    题目大意 假设有a头牛,b辆车(门的总数为a+b),你先选一个门,然后你最终选择前主持人会替你打开C扇有牛的门(不会打开你已经选择的门),问你要不要换门,输出"总是换门"的策略下, ...

  2. RandomAccessFile类学习

    RandomAccessFile类学习 RandomAccessFile是io包的类,从Object直接继承而来,只可以对文件进行操作,可以对文件进行读取和写入. 当模式为r:当文件不存在时会报异常: ...

  3. C#高级编程42章 MVC

    42.1 ASP.NET MVC 路由机制 网络介绍链接 按照传统,在很多Web框架中(如经典的ASP.JSP.PHP.ASP.NET等之类的框架),URL代表的是磁盘上的物理文件.例如,当看到请求h ...

  4. Random 生成随机数

    Random类 (java.util) Random类中实现的随机算法是伪随机,也就是有规则的随机.在进行随机时,随机算法的起源数字称为种子数(seed),在种子数的基础上进行一定的变换,从而产生需要 ...

  5. IntelliJ IDEA 代码调式

    Mute Breakpoints: 保留所有断点,但是不执行(程序一次性执行). Condition: 条件触发 即当执行到i的值变为5的时候,在断点处暂停.

  6. python基础知识(1)(个人整理)

    import文件夹下的py文件: 情况1: `-- src    |-- mod1.py    `-- test1.py 直接 import mod1.py即可 情况2: -- src |-- mod ...

  7. Spring框架之接口实现覆盖(接口功能扩展)

    在日常开发中,存在着这种一种场景,框架对接口A提供了一个种默认的实现AImpl,随着需求的变更,现今AImpl不能满足了功能需要,这时,我们该怎么办? 当然是修改AImpl的实现代码了,但是,如果它是 ...

  8. linux内核，驱动，应用程三者的概念和之间的关系

    驱动程序属于内核的一个部分.准确的说是内核的一个组件.不包含驱动的内核也叫做内核,并且这也是我们常说的内核.内核要干的事情无非5件. 1,内存管理 2,虚拟文件系统 3,进程调度 4,网络接口 5,进 ...

  9. 累加器A与ACC区别

    累加器写成A或ACC在51汇编语言指令中是有区别的. ACC在汇编后的机器码必有一个字节的操作数,即累加器的字节地址E0H,A在汇编后则隐含在指令操作码中.所以在指令中A不能用ACC来替代,而对A的特 ...

  10. 老牌激活工具 — Microsoft Toolkit 2.5.1正式版【转】

    老牌激活工具 — Microsoft Toolkit 2.5.1正式版  Microsoft Toolkit 2.5.1是一个一键激活MS Office 及 win系统的工具.原理就是利用KMS来激活 ...