<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery实现复选框的全选和全不选</title>
</head>
<body>
<label><input type="checkbox" name="checkall" />全选</label>
<br><br>
<label><input type="checkbox" name="checkbox" />复选框1</label>
<label><input type="checkbox" name="checkbox" />复选框2</label>
<label><input type="checkbox" name="checkbox" />复选框3</label>
<label><input type="checkbox" name="checkbox" />复选框4</label>
<label><input type="checkbox" name="checkbox" />复选框5</label>

<!-- 引入jQuery官方类库 -->
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<!-- start 全选/全不选 -->
<script type="text/javascript">
$('input[name="checkall"]').on("click",function(){
if($(this).is(':checked')){
$('input[name="checkbox"]').each(function(){
$(this).prop("checked",true);
});
}else{
$('input[name="checkbox"]').each(function(){
$(this).prop("checked",false);
});
}
});
</script>
<!-- end 全选/全不选 -->
</body>
</html>

input全选和取消全选的更多相关文章

  1. 使用AngularJS实现简单:全选和取消全选功能

    这里用到AngularJS四大特性之二----双向数据绑定 注意:没写一行DOM代码!这就是ng的优点,bootstrap.css为了布局,JS代码也只是简单创建ng模块和ng控制器 效果: < ...

  2. jQuery --checkbox全选和取消全选简洁高效的解决办法

    最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二 ...

  3. bootstrap实现checkbox全选、取消全选

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!-- 最新版本的 ...

  4. JS对checkbox全选和取消全选

    需求:checkbox控制列表数据全选与取消全选择. 效果图: 1.html <body > <input type="button" name="in ...

  5. react实现全选、取消全选和个别选择

    react里面实现全选和取消全选,个别选择等操作,效果如下 代码: import React, {Component} from 'react' export default class Demo e ...

  6. js实现checkbox组 全选和取消全选

    做后台管理程序时,用到一个checkbox组的全选和取消全选的功能, 主要是逻辑上的坑,理清后大概是: 1.全选点击后,小弟1~4都要选上,点击取消,小弟们也要取消 2.只要有一个小弟取消时,全选要取 ...

  7. js全选与取消全选

    实现全选与取消全选的效果 要求1(将军影响士兵):点击全选按钮,下面的复选框全部选中,取消全选按钮,下面的复选框全部取消 思路:复选框是否被选中,取决于check属性,将全选按钮的check属性值赋值 ...

  8. JS实现表单全选以及取消全选实例

    实现效果: 全选按钮:点击全选按钮所有的小按钮都会被选中:点掉全选按钮,所有按钮取消选中: 小按钮:只有全部被选中,全选按钮才会被选中 思路分析: 1.全选和取消全选做法:让下面所有复选框的 chec ...

  9. jquery购物车全选,取消全选,计算总金额

    这是html代码 <div class="gwcxqbj"> <div class="gwcxd center"> <div cl ...

  10. DataGridView添加一行数据、全选、取消全选、清空数据、删除选中行

    .net 2005下的Windows Form Application,一个DataGridView控件和4个Button,界面设置如下:         代码如下,有注解,相信大家都看得明白:   ...

随机推荐

  1. Nginx健康检查模块

    在本小节我们介绍一个用于Nginx对后端UpStream集群节点健康状态检查的第三方模块:nginx_upstream_check_module(https://github.com/yaoweibi ...

  2. 3.18 总结 java 基础语法

  3. Cookie 版购物车

    写一个JS文件  把相应的方法写在JS文件内 为了方便以后的调用 具体代码为 var Cart = function () { this.Count = 0; this.Total = 0; this ...

  4. OpenCV——图像处理入门:膨胀与腐蚀、图像模糊、边缘检测

    全部外部依赖项: opencv_aruco341d.lib opencv_bgsegm341d.lib opencv_calib3d341d.lib opencv_bioinspired341d.li ...

  5. C++ shared_ptr、unique_ptr、weak_ptr

    shared_ptr unique_ptr weak_ptr 内存泄漏 智能指针 引用计数 循环引用 reset

  6. 实现一个book类

    设计实现一个book类 具体要求 定义义成Book.java,Book 包含书名,作者,出版社和出版日期,这些数据都要定义getter和setter. 定义至少三个构造方法,接收并初始化这些数据. 覆 ...

  7. 一本通 1223:An Easy Problem

    \[传送门qwq\] [题目描述] 给定一个正整数N,求最小的.比N大的正整数M,使得M与N的二进制表示中有相同数目的1. 举个例子,假如给定的N为78,其二进制表示为1001110,包含4个1,那么 ...

  8. PHP处理XML文档,没有CDATA部分数据处理

    在博客备份时,导出了所有文章,导出是xml文档,文章内容在CDATA部分. 这里介绍下XML中CDATA: 所有 XML 文档中的文本均会被解析器解析.只有 CDATA 区段(CDATA sectio ...

  9. keepalived--小白博客

    一.HA集群中的相关术语 1.节点(node) 运行HA进程的一个独立主机,称为节点,节点是HA的核心组成部分,每个节点上运行着操作系统和高可用软件服务,在高可用集群中,节点有主次之分,分别称之为主节 ...

  10. String Successor zoj 3490

    链接 [https://vjudge.net/contest/294259#problem/D] 题意 就是给你一个字符串,要进行n次操作 让你输出每次的字符串 操作规则: 1.如果有数字或者字母就忽 ...