input全选和取消全选
<!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全选和取消全选的更多相关文章
- 使用AngularJS实现简单:全选和取消全选功能
这里用到AngularJS四大特性之二----双向数据绑定 注意:没写一行DOM代码!这就是ng的优点,bootstrap.css为了布局,JS代码也只是简单创建ng模块和ng控制器 效果: < ...
- jQuery --checkbox全选和取消全选简洁高效的解决办法
最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二 ...
- bootstrap实现checkbox全选、取消全选
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!-- 最新版本的 ...
- JS对checkbox全选和取消全选
需求:checkbox控制列表数据全选与取消全选择. 效果图: 1.html <body > <input type="button" name="in ...
- react实现全选、取消全选和个别选择
react里面实现全选和取消全选,个别选择等操作,效果如下 代码: import React, {Component} from 'react' export default class Demo e ...
- js实现checkbox组 全选和取消全选
做后台管理程序时,用到一个checkbox组的全选和取消全选的功能, 主要是逻辑上的坑,理清后大概是: 1.全选点击后,小弟1~4都要选上,点击取消,小弟们也要取消 2.只要有一个小弟取消时,全选要取 ...
- js全选与取消全选
实现全选与取消全选的效果 要求1(将军影响士兵):点击全选按钮,下面的复选框全部选中,取消全选按钮,下面的复选框全部取消 思路:复选框是否被选中,取决于check属性,将全选按钮的check属性值赋值 ...
- JS实现表单全选以及取消全选实例
实现效果: 全选按钮:点击全选按钮所有的小按钮都会被选中:点掉全选按钮,所有按钮取消选中: 小按钮:只有全部被选中,全选按钮才会被选中 思路分析: 1.全选和取消全选做法:让下面所有复选框的 chec ...
- jquery购物车全选，取消全选，计算总金额
这是html代码 <div class="gwcxqbj"> <div class="gwcxd center"> <div cl ...
- DataGridView添加一行数据、全选、取消全选、清空数据、删除选中行
.net 2005下的Windows Form Application,一个DataGridView控件和4个Button,界面设置如下: 代码如下,有注解,相信大家都看得明白: ...
随机推荐
- InvalidOperationException: Unable to resolve service for type 'Microsoft.AspNetCore.Identity.UserManager`1[Microsoft.AspNetCore.Identity.IdentityUser]'
在新建asp.net core 应用后, 添加了自定义的ApplicationDbContext 和ApplicationUser ,并添加了Identity认证后, 会出现 InvalidOpera ...
- 第1章 初始Docker容器
1.1 什么是Docker slogan:Build Ship Run Any App Anywher.关键在于Ship,通过把程序和程序运行所需要的环境一起交付. Linux容器技术: Docker ...
- 24 python初学（异常）
try, except, else, finally执行顺序:1. 先执行 try 里面的代码块,如果发生异常就会去捕获. 2. 没有错误就会执行 else 里面的信息. 3. 无论怎样都会执行 fi ...
- ORM相关操作
1.一般操作 <1> all(): 查询所有结果 <2> filter(**kwargs): 它包含了与所给筛选条件相匹配的对象 <3> get(**kwargs) ...
- kafka原理深入研究 （转 )
一.为什么需要消息系统 1.解耦: 允许你独立的扩展或修改两边的处理过程,只要确保它们遵守同样的接口约束. 2.冗余: 消息队列把数据进行持久化直到它们已经被完全处理,通过这一方式规避了数据丢失风险. ...
- 软件工程(GZSD2015) 第二次作业成绩
作业评分表 姓名 提交 语言 界面 PSP(3) CODE(4) 代码规范(2) 改进(1) 基本得分 提交时间 原始总得分 相对得分 最终得分 涂江凤 20150407 C CLI 3 4 2 1 ...
- dubbo 使用zookeeper 出现 Dubbo客户端调用报错NullPointerException
现在将网上的方法总结一下 方法一:.https://blog.csdn.net/u011294519/article/details/81810631 dubbo-provider.xml:提供者先扫 ...
- oracle创建表空间等相关语句
在数据库可视化工具中执行以下语句,可建立Oracle表空间. 主要分为四步 1.创建临时表空间 create temporary tablespace xuanwu_temp tempfile 'D: ...
- openstack oslo.messaging库
openstack oslo.messaging库 2017年04月13日 22:13:25 li_101357 阅读数:1383 版权声明:本文为博主原创文章,未经博主允许不得转载. https ...
- 虚拟机iso整理
供个人备用,随缘补充 ubuntu-16.04.6-desktop-amd64.iso 资源: https://pan.baidu.com/s/1ZR_5jgzNsGeOrkE6hAqxEA 提取码: ...