<!DOCTYPE html>

<html>

<head>

    <title></title>

    <meta charset="utf-8">

    <script type="text/javascript" src='http:cdn.bootcss.com/jquery/3.1.1/jquery.min.js'></script>

</head>

<body>

    <form>

        <input type="checkbox" class="all"> 全选

        <input type="checkbox" class="reverse"> 反选

        <input type="checkbox" value="1" class="sub"> 1

        <input type="checkbox" value="2" class="sub"> 2

        <input type="checkbox" value="3" class="sub"> 3

        <input type="checkbox" value="4" class="sub"> 4

        <input type="button" value="click">

        <input type="reset">

    </form>

    <script type="text/javascript">

    $(function() {

        $('.all').on('click', function(e) {

            var isChecked = $(this).prop("checked");

            $(".sub").prop("checked", isChecked);

        })

        $('.reverse').on('click', function(e) {

            $(".sub").each(function(index, ele) {

                var checked = $(ele).is(':checked') ? '' : 'checked'

                $(ele).prop("checked", checked);

            })

        })

        $('.sub').on('click', function(e) {

            var checked = ($('.sub').length == $('.sub:checked').length ? 'checked' : '')

            $('.all').prop('checked', checked)

        })

        $("input[type='button']").bind('click',function(){

            var obj = $('.sub').map(function(index,ele){

                return $(ele).val()

            })

            var arr = Array.prototype.slice.call(obj)

            alert(JSON.stringify(arr))

        })

    })

    </script>

</body>

</html>

jQuery 之玩转 checkbox的更多相关文章

  1. jquery数组之存放checkbox全选值示例代码

    使用jquery数组可以存放checkbox全选值,下面有个不错的示例,感兴趣的朋友可以参考下. 复制代码代码如下: <input type="checkbox" id=&q ...

  2. jQuery 操作 input 之 checkbox

    jQuery 操作 input 之 checkbox 一片 HTML 清单: <input type="checkbox" name="hobby" va ...

  3. JQuery 多选按钮checkbox

    JQuery 多选按钮checkbox 在需要全选和选择部分的时候我们就需要多选在这里主要介绍了具体的实现 JQuery $(function () { //全选或全不选 $("#allbo ...

  4. jquery选中radio或checkbox的正确姿势

    jquery选中radio或checkbox的正确姿势 Intro 前几天突然遇到一个问题,没有任何征兆的..,jquery 选中radio button单选框时,一直没有办法选中,后来查了许多资料, ...

  5. jquery的radio和checkbox的标签的操作集合

    jquery的radio和checkbox的标签的操作集合: $("input[name='radio_name'][checked]").val(); //选择被选中Radio的 ...

  6. jquery选择器玩得不6啊，只能慢慢写判断了，唉..........................

    jquery选择器玩得不6啊,只能慢慢写判断了,唉..........................

  7. JQuery 实现多个checkbox 只选中一个

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

  8. [转]jQuery操作radio、checkbox、select 集合.

    1.radio:单选框 html代码 <input type="radio" name="radio" id="radio1" val ...

  9. 《jQuery判断radio、checkbox、select 是否选中和设置选中问题以及获取选中值》总结

    <form> <input type="radio" name="gender" id="man" value=" ...

随机推荐

  1. DataUml Design 课程6-DataUML Design 1.1版本号正式宣布（支持PD数据模型）

    从DataUML Design正式宣布到现在两个月,因为最近忙,出版到现在为止1.1版本号.稍后我们将始终坚持以良好DataUML Design软件,我希望程序员有很多支持. 一.1.1新的和改进的版 ...

  2. Android: 自定义Tab样式,一种简单的方式。

    之前看到过论坛里已经有人发过自定义Tab样式的帖子,感觉有些复杂了,这里分享个简单的方法. 1.制作4个9patch的tab样式,可参考android默认的资源 tab_unselected.9.pn ...

  3. script —— 终端里的记录器

    当 你在终端或者控制台工作时,你可能想要记录在终端中所做的一切.这些记录可以用来当作史料,保存终端所发生的一切.比如说,你和一些Linux管理员们同 时管理着相同的机器,或者你让某人远程登陆到了你的服 ...

  4. YARN之上的大数据框架REEF：微软出品，是否值得期待？

    YARN之上的大数据框架REEF:微软出品,是否值得期待?   摘要:微软即将开源大数据框架REEF,REEF运行于Hadoop新一代资源管理器YARN的上层.对于机器学习等在数据传输.任务监控和结果 ...

  5. jstl标签的fmt:formatDate格式化日期 String to Date

    使用fmt函数需在jsp中引入 <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" ...

  6. struts整合spring整合hibernate

    1, web.xml中配置spring监听类 <listener> <listener-class>org.springframework.web.context.Contex ...

  7. Modern 阅读笔记 一 PSR标准

    一.标准 PSR php standards Recommendation PHP 推荐标准 PSR-1 基本代码风格 PSR-2 严格的代码风格  PSR-3 日志记录器接口 PSR-4 自动加载  ...

  8. java读取properties 文件信息

      src下config/tank.properties文件 initTankCount=10 ReinitTankCount=8 Etmspeed=15 Mtmspeed=15 MTankCount ...

  9. linux下安装NPM管理工具

    根据”挖一下“开发需要,选择nodejs实现异步IO,目的是为了解决服务器卡死导致无法处理后续的http请求.看了花瓣的架构视频讲座,才决定这么做的,挺有道理的. 安装nodejs很顺利,下载源码包, ...

  10. 新软件马上就要完成了,先发篇文章YY下

    最近一直都在搞网站抓取方面的开发,闲着无聊逛逛论坛,发现有些帖子还是写的相当不错的,只是一篇一篇的点进去比较麻烦,于是就写了个小软件只是为了方便查看博客园和CSDN上的优秀文章.其实这个还可以拓展的, ...