废话不说，直接上代码！

<html>

<head>

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

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

<title>Insert title here</title>

</head>

<body>

<div style="margin: 20px;">

        全选：<input type="checkbox" id="selectAll" onclick="selects1()">

    </div>

<div style="width:600px;height: 40px;border: 1px solid #ccc">

    多选框1：<input type="checkbox" class="check_class">

    多选框2：<input type="checkbox" class="check_class">

    多选框3：<input type="checkbox" class="check_class">

    多选框4：<input type="checkbox" class="check_class">

    多选框5：<input type="checkbox" class="check_class">

    多选框6：<input type="checkbox" class="check_class">

</div><br>

<script type="text/javascript">

/*

 * 方法1 在工作电脑和本地电脑都可以正常工作

 * 方法2 在工作电脑只起一次作用，即勾选全选，反选后。再次勾选，不再起作用。本地电脑一样可以正常运行

 * 可能原因是jquery版本问题 ? 工作电脑jQuery版本为1.11系列。这里为3.1.1

 */

    //实现方法1

    function selects1(){

        //实现全选，反选功能

        var selectStatus = $('#selectAll').is(':checked');

        $('.check_class').each(function(){

            $(this).prop('checked',selectStatus);

        });

    }

    //实现方法2

    function selects2(){

        //实现全选，反选功能

        var selectStatus = $('#selectAll').is(':checked');

        $('.check_class').each(function(){

            $(this).attr('checked',selectStatus);

        });

    }

</script>

</html>

jQuery实现全选反选功能的更多相关文章

  1. jquery 书写全选反选功能

    书写一个后台管理中用到的全选反选功能.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  2. jquery实现全选/反选功能

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

  3. python: jquery实现全选 反选 取消

    引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...

  4. JavaScript 实现全选 / 反选功能

    JavaScript 实现全选 / 反选功能 版权声明:未经授权,内容严禁转载! 构建主体界面 编写 HTML 代码 和 CSS 代码,设计主题界面 <style> #user { wid ...

  5. JS全选反选功能

    总选框:<input type="checkbox" class="all" name="all"> 子选框: <inpu ...

  6. jQuery实现全选/反选和批量删除

    <%@ page language="java" contentType="text/html; charset=utf-8"     pageEncod ...

  7. JQuery实现列表中复选框全选反选功能封装

    我们在做列表的时候经常会遇到全选,反选进行批量处理问题,例如: 我当时就是简单的实现了,然后想封装到公共的js中,封装的太烂,不好意思贴出来了(就是把实现代码之间放到公共js中,然后每个页面都用固定的 ...

  8. C# WinForm中实现CheckBox全选反选功能

    今天一群里有人问到这个功能,其实应该挺简单,但提问题的人问题的出发点并没有描述清楚.因此,一个简简单单的需求,就引起了群内热烈的讨论.下面看看这个功能如何去实现,先上效果: 下面直接上代码,请不要在意 ...

  9. jquery 实现全选反选

    jquery代码 $(function () { $('#inputCheck').click(function () { if ($(this).attr("checked")) ...

随机推荐

  1. win32com操作word（3）：导入VBA常量

    导入VBA常量方法:http://blog.sina.com.cn/s/blog_a73687bc0101k8x8.html 我们之前说过,win32com组件为python提供处理COM组件(.dl ...

  2. java-01

    二,八,十六进制到十进制的转换方法: 十进制到二,八,十六进制的转换方法: 2:标识符(掌握) (1)就是给类,接口,方法,变量等起名字的字符序列 (2)组成规则: A:英文大小写字母 B:数字 C: ...

  3. Jasper：目录/资源

    ylbtech-Jasper:目录/资源 1. 官网返回顶部 1. https://www.jasper.com/ 2. 2.返回顶部 1. http://api.jasperwireless.com ...

  4. web.xml中<security-constraint>安全认证标签说明

      1.security-constraint元素 部署描述符中的<security-constraint>元素允许不通过编程就可以限制对某个资源的访问. <security-con ...

  5. C++与UnrealScript脚本交互

    转自:http://m.blog.csdn.net/blog/qweewqpkn/39932499 一.c++调用uc脚本中的函数 举例: 1. 在脚本MenuManager.uc文件中实现函数: e ...

  6. 卸载 Ubuntu gnome 自带的 Videos, Browser, Document Viewer等

    卸载命令 # uninstall Browser sudo apt-get remove --purge webbrowser-app # uninstall Videos sudo apt-get ...

  7. [hiho第92周]Miller-Rabin素性测试的c++实现

    证明: 如果n是素数,整数$a$ 与$n$ 互素,即$n$ 不整除$a$ ,则${a^{n - 1}} \equiv 1(\bmod n)$ ,如果能找到一个与$n$ 互素的整数$a$ ,是的上式不成 ...

  8. Linux下使用sendEmail发送带附件的邮件（转载）

    转载:http://www.ttlsa.com/linux/use-sendemail-send-file/ sendEmail是一个轻量级,命令行的SMTP邮件客户端.如果你需要使用命令行发送邮件, ...

  9. Android图片压缩框架-Tiny 集成

    为了简化对图片压缩的调用,提供最简洁与合理的api压缩逻辑,对于压缩为Bitmap根据屏幕分辨率动态适配最佳大小,对于压缩为File优化底层libjpeg的压缩,整个图片压缩过程全在压缩线程池中异步压 ...

  10. PJzhang：经典子域名爆破工具subdomainsbrute

    猫宁!!! 参考链接: https://www.waitalone.cn/subdomainsbrute.html https://www.secpulse.com/archives/5900.htm ...