jQuery实现全选反选功能
废话不说,直接上代码!
<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实现全选反选功能的更多相关文章
- jquery 书写全选反选功能
书写一个后台管理中用到的全选反选功能.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta ...
- jquery实现全选/反选功能
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...
- python: jquery实现全选 反选 取消
引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...
- JavaScript 实现全选 / 反选功能
JavaScript 实现全选 / 反选功能 版权声明:未经授权,内容严禁转载! 构建主体界面 编写 HTML 代码 和 CSS 代码,设计主题界面 <style> #user { wid ...
- JS全选反选功能
总选框:<input type="checkbox" class="all" name="all"> 子选框: <inpu ...
- jQuery实现全选/反选和批量删除
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncod ...
- JQuery实现列表中复选框全选反选功能封装
我们在做列表的时候经常会遇到全选,反选进行批量处理问题,例如: 我当时就是简单的实现了,然后想封装到公共的js中,封装的太烂,不好意思贴出来了(就是把实现代码之间放到公共js中,然后每个页面都用固定的 ...
- C# WinForm中实现CheckBox全选反选功能
今天一群里有人问到这个功能,其实应该挺简单,但提问题的人问题的出发点并没有描述清楚.因此,一个简简单单的需求,就引起了群内热烈的讨论.下面看看这个功能如何去实现,先上效果: 下面直接上代码,请不要在意 ...
- jquery 实现全选反选
jquery代码 $(function () { $('#inputCheck').click(function () { if ($(this).attr("checked")) ...
随机推荐
- Java丨角色权限控制——数据库设计
相信各位读者对于角色权限管理这个需求并不陌生.那么是怎么实现的呢?今天小编来说道说道! 1.首先我们来进行数据库的设计,如何设计数据库是实现权限控制的关键: 1)用户表: id:主键.自增.int n ...
- linux 命令:crontab
一.crond简介 crond 是linux下用来周期性的执行某种任务或等待处理某些事件的一个守护进程,与windows下的计划任务类似,当安装完成操作系统后,默认会安装此服务 工具,并且会自动启动c ...
- zero to one(1)
How to google 这两天把之前的过期的账号重新弄了一下,在vutrl上的账号,普通的话现在2.5$只提供ipv6地址,如果是想google我觉得这个应该没有什么问题,或者可以买***的账号, ...
- 如何理解 Spring 注入
先看一段代码 假设你编写了两个类,一个是人(Person),一个是手机(Mobile). 人有时候需要用手机打电话,需要用到手机的dialUp方法. 传统的写法是这样: Java code publi ...
- poj1733 Parity game[带权并查集or扩展域]
地址 连通性判定问题.(具体参考lyd并查集专题该题的转化方法,反正我菜我没想出来).转化后就是一个经典的并查集问题了. 带权:要求两点奇偶性不同,即连边权为1,否则为0,压缩路径时不断异或,可以通过 ...
- PageMethods
主要是用到ScriptManger,老知识Mark一下,ScriptManager要EnablePageMethods="true" 后台 using System.Web.Scr ...
- asm 兼容性、asm 主要参数管理
一 ASM instance 与 Database instance 的版本兼容性说明 1. Oracle 11gR2 的ASM 支持11g和10g的数据库实例.但是在Oracle Clusterwa ...
- local_irq_save 与 local_irq_restore
如果你要禁止所有的中断该怎么办? 在2.6内核中,可以通过下面两个函数中的其中任何一个关闭当前处理器上的所有中断处理,这两个函数定义在 <asm/system.h>中: void ...
- ACM实用C语言函数
函数名: abs 功 能: 求整数的绝对值 用 法: int abs(int i); 程序例: #include <stdio.h> #include <math.h> int ...
- openStack灾备方案说明
本系列会分析OpenStack 的高可用性(HA)概念和解决方案: (1) OpenStack 高可用方案概述 (2) Neutron L3 Agent HA - VRRP (虚拟路由冗余协议) (3 ...