<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title></title>

 <!--   引入jQuery -->

 <script src="../scripts/jquery-1.3.1.js" type="text/javascript"></script>

 <script type="text/javascript">

$(function(){

     //全选

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

            //所有checkbox跟着全选的checkbox走。

            $('[name=items]:checkbox').attr("checked", this.checked );

     });

     $('[name=items]:checkbox').click(function(){

                //定义一个临时变量，避免重复使用同一个选择器选择页面中的元素，提升程序效率。

                var $tmp=$('[name=items]:checkbox');

                //用filter方法筛选出选中的复选框。并直接给CheckedAll赋值。

                $('#CheckedAll').attr('checked',$tmp.length==$tmp.filter(':checked').length);

            /*

                //一行做过多的事情需要写更多注释。复杂选择器还可能影响效率。因此不推荐如下写法。

                $('#CheckedAll').attr('checked',!$('[name=items]:checkbox').filter(':not(:checked)').length);

            */

     });

      //输出值

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

        var str="你选中的是：\r\n";

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

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

        })

        alert(str);

    });

});

  </script>

</head>

<body>

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

   你爱好的运动是？<input type="checkbox" id="CheckedAll" />全选/全不选<br/>

    <input type="checkbox" name="items" value="足球"/>足球

    <input type="checkbox" name="items" value="篮球"/>篮球

    <input type="checkbox" name="items" value="羽毛球"/>羽毛球

    <input type="checkbox" name="items" value="乒乓球"/>乒乓球<br/>

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

</form>

</body>

</html>

jquery checkbox选中状态的更多相关文章

  1. jquery checkbox选中状态以及实现全选反选

    jquery1.6以下版本获取checkbox的选中状态: $('.ck').attr('checked'); $('.ck').attr('checked',true);//全选 $('.ck'). ...

  2. 前端开发学习之——使用jquery/javascript判断及改变checkbox选中状态

    一.使用jquery判断及改变checkbox选中状态 1.使用JQuery判断一个checkbox 是否为选中: (1).attr('checked) 看JQuery版本1.6+返回:”checke ...

  3. html中radio、checkbox选中状态研究（静下心来看，静下心来总结）

    html中radio.checkbox选中状态研究(静下心来看,静下心来总结) 一.总结 1.单选框的如果有多个checked 会以最后一个为准 2.js动态添加checked属性:不行:通过 $(& ...

  4. jquery--获取input checkbox是否被选中以及渲染checkbox选中状态

    jquery获取checkbox是否被选中 html <div><input type="checkbox" id="is_delete" n ...

  5. # li鼠标移入移出，点击，变背景色，变checkbox选中状态

    移入移出背景色改变和点击背景色改变,两者是否相互覆盖? 若移出背景色恢复,影响点击事件的背景色改变,会产生效果为: 点击时,背景色改变,并且checkbox选中 鼠标移开后,checkbox仍选中,但 ...

  6. jquery -- checkbox选中无选中状态

    最近在工作中使用jquery操作checkbox,使用下面方法进行全选.反选: var ischecked=allCheckObj.is(':checked'); ischecked?checksOb ...

  7. jQuery控制checkbox选中状态但是不显示选中

    问题描述:使用jQuery来控制checkbox的选中状态,但是第一次点击出现选中样式,之后点击可以看到checked的属性增加成功但是并没有选 中状态. 问题代码: function chooseA ...

  8. JQuery获取指定元素中的checkbox选中状态的一些属性

    项目中用户上传病例数据,每一次上传自动生成一个病例文件夹,数据保存到后台,前端显示文件夹,现在的需求是勾选想要删除的文件夹的chenckbox,点击删除后,数据库和前端都相应的更新. 如果是静态页面, ...

  9. layui动态设置checkbox选中状态

    今天在使用jquery动态设置layui的checkbox元素的选中状态时始终只能取消选中,却不能重新勾选,点击勾选则没有问题,代码如下 if (value == "true") ...

随机推荐

  1. 树莓派 不稳定 ssh经常断 解决

    确保供电没问题,供电至少要0.7A,如果USB口有接东西就要更多 几个提高树莓派网络稳定性的方法 TroubleShooting(推荐!好多问题的解决方案) 设置树莓派SSH连接因超时闲置断开 树莓派 ...

  2. ASP.NET MVC之文件上传【一】

    前言 这一节我们来讲讲在MVC中如何进行文件的上传,我们逐步深入,一起来看看. Upload File(一) 我们在默认创建的项目中的Home控制器下添加如下: public ActionResult ...

  3. UIButton 在UIScrollView里面 点击效果不明显的问题

    self.scrollView.delaysContentTouches = NO; -(BOOL)touchesShouldCancelInContentView { return YES; }

  4. Php 笔记1-----request和 response

    不能大于2KB 第一次学习 php,  因为以前习惯了 .net, 所以 刚开始总是按照.net的  思路去思考, 怎么获取 客户端发过来的  request对象啊,  怎么设置response啊.. ...

  5. SoapUI中Groovy的实用方法

    1.依照上次结果判断下步是否执行: import com.eviware.soapui.model.testsuite.TestStepResult.TestStepStatus myTestStep ...

  6. 链接服务器"(null)"的 OLE DB 访问接口 "Microsoft.Jet.OLEDB.4.0" 返回了消息 "未指定的错误"。[手稿]

    消息 7302,级别 16,状态 1,第 1 行 无法创建链接服务器 "(null)" 的 OLE DB 访问接口 "Microsoft.JET.OLEDB.4.0&qu ...

  7. 在刚接触TI-DM8127-ipnc框架时注意的问题

    1. 修改内存分配不成功? 解决方法: 修改内存分配后需要重新编译mcfw.它影响3个核. 如果修改了cmem需要修改boostara. 2. 命令make clean后在make相机跑不起来? 解决 ...

  8. （转载）OC学习篇之---类目的概念和使用

    上一篇文章介绍了OC中的@class关键字的使用,这一篇我们介绍一下,OC中的一个特有的亮点:类目 首先我们来看一下场景,如果我们现在想对一个类进行功能的扩充,我们该怎么做? 对于面向对象编程的话,首 ...

  9. 闲置小U盘变身最强大路由器

    小容量 U 盘,用起来嫌容量太少,丢了好像又觉得太可惜.不过现在将它进行一番小改造后,配合我们的电脑 ,就能得到一台强大的路由器,不仅省了买路由的钱,而且这台路由器在市面上基本买不到 !     DD ...

  10. 使用Thrift RPC编写程序（服务端和客户端）

    1. Thrift类介绍 Thrift代码包(位于thrift-0.6.1/lib/cpp/src)有以下几个目录: concurrency:并发和时钟管理方面的库processor:Processo ...