<script type="text/javascript">

 $(function(){

     //全选

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

         $('[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);

     });

     //输出值

     $("#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="">

    <b>你爱好的运动是?</b><br/>

    <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>

jQuery 复选框全选反选的更多相关文章

  1. jQuery 复选框全选/取消全选/反选

    jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...

  2. jQuery 前端复选框 全选 反选 下拉菜单联动

    jQuery 页面中复选框全选.反选.下拉联动(级联) <!DOCTYPE html> <html lang="en"> <head> < ...

  3. Jquery表格变色 复选框全选，反选

    /*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...

  4. jQuery实现复选框 全选、反选、全不选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  5. jQuery 实现复选框全选、反选及获取选中的值

    实现复选框全选,反选及获取选中的值: 代码如下: <!doctype html> <html lang="en"> <head> <met ...

  6. 复选框全选、全不选和反选的效果实现VIEW:1592

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  7. html+css+js实现复选框全选与反选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  8. js 判断 复选框全选、全不选、反选、必选一个

    一个挺 使用的 js 代码片段,  判断  复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...

  9. jQuery中的几个案例：隔行变色、复选框全选和全不选

    1 表格隔行变色 1 技术分析: 1 )基本过滤选择器: odd: even: 2 )jq添加和移除样式: addClass(); removeClass(); 2 代码实现 <script s ...

  10. vue+vant-UI框架写的购物车的复选框全选和反选

    购物车页面的设计图 商品的列表 代码: <ul v-if="shoppingListData.rows.length"> <li v-for="(ite ...

随机推荐

  1. Android 蓝牙 BLE 开发笔记

    最近公司头戴换了一块蓝牙4.0 BLE模块,所以我们Android组要适配 BLE.Android BLE 需要 4.3 以上系统,api 还是非常简单的, 第一步就是扫描, 扫描到设备后就可以连接了 ...

  2. Nightmare

    Nightmare Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total S ...

  3. 【BZOJ】1901: Zju2112 Dynamic Rankings（区间第k小+树状数组套主席树）

    http://www.lydsy.com/JudgeOnline/problem.php?id=1901 首先还是吐槽时间,我在zoj交无限tle啊!!!!!!!!我一直以为是程序错了啊啊啊啊啊啊. ...

  4. css样式表：样式分类，选择器。样式属性，格式与布局

    样式表分类: 1.内联样式表, 和html联合显示,例:<p style="font-size:14px;">内联样式表</p> 2.内嵌样式表 作为一个独 ...

  5. prelaod场景，用来显示资源加载进度

    phaser.js的源码可以到它在github上的托管里去下载,游戏要用到的图片声音等素材资源请点击这里下载.Phaser的使用非常简单,只需要引入它的主文件,然后在页面中指定一个用来放置canvas ...

  6. 对于PKI(公钥基础结构)及证书服务的通俗理解

    对于PKI及证书服务的这些概念,相信初学者会有许多迷惑的地方,那是因为其中的某些关键概念没有理解清楚,我力争以通俗易懂的方式给初学者一些启示,也给以后自己忘了的时候一个参考:) ! 参考资料:http ...

  7. 增加Activity Monitor中的作业保存数量

    在Master Server的注册表中加入如下两个键值即可: (1500的单位是小时)  

  8. [kuangbin带你飞]专题六 最小生成树

    学习最小生成树已经有一段时间了 做一些比较简单的题还算得心应手..花了三天的时间做完了kuangbin的专题 写一个题解出来记录一下(虽然几乎都是模板题) 做完的感想:有很多地方都要注意 n == 1 ...

  9. iOS标准时间与时间戳相互转换

    iOS标准时间与时间戳相互转换 (2012-07-18 17:03:34) 转载▼ 标签: ios 时间戳 标准时间 格式 设置 转化 杂谈 分类: iPhone开发 设置时间显示格式:     NS ...

  10. 10 位顶级 PHP 大师的开发原则

    10 位顶级 PHP 大师的开发原则 ruby_chen 发布于: 2013年03月28日 (61评) 分享到:    收藏 +139 #深圳# 6月10日 亚马逊AWSome Day云计算免费培训报 ...