<!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>

转载于:https://www.cnblogs.com/Fancy1486450630/p/10173885.html

input全选和取消全选相关推荐

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

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

  2. 在项目中学习.NET的JQuery CheckBox方法(全选、取消全选、其他）

    一.在项目中遇到的CheckBox的全选和取消全选以及其他等解决方案如下: // 对全选和取消全选的事件 $("#CheckAll").click(function () {    ...

  3. vue全选和取消全选（无bug）

    很简单的使用vue实现全选和取消全选 直接上代码,简单易懂不懂得可以留言. <!DOCTYPE html> <html lang="en"> <hea ...

  4. 实现全选和取消全选功能

    <body> <div class="wrap"> <table> <thead> <tr> <th> &l ...

  5. 通过js控制layui选择框checkbox的选中、取消选中，以及使用layui实现全选、取消全选的一种方式

    js控制选中.取消选中 ,layui实现全选.取消全选 layui版本2.5.x html部分: <form class="layui-form" id="form ...

  6. 全选或者取消全选代码

    全选或者取消全选代码: $("#selectAll").click(function(){$("tbody input[type='checkbox']").p ...

  7. js表单全选和取消全选

    这是一个全选和取消全选的功能,最上边的是全选框,下边的是单选框. 1. 全选框选中,下边的所有单选框也都选中,全选框取消选中,下边的单选全不选中.如果全选选中情况下,下边的取消选中一个,哪上边的全选框 ...

  8. 复选框的全选和取消全选

    复选框的全选和取消全选 <!DOCTYPE html> <html><head><meta charset="utf-8">< ...

  9. 学习DOM的第二天 练习案例：表格隔行变色 表格的全选与取消全选

    1.表格的隔行变色 鼠标划入与划出.   划入变色className='bg',划出className=' ' : <!DOCTYPE html> <html lang=" ...

  10. js实现复选框的全选、取消全选、反选

    思路很简单: 全选:将所有复选框的checked设置为true 取消全选:将所有复选框的checked设置为false 反选:将所有选中的复选框设置为false,未选中的设置为true.即将check ...

最新文章

  1. 什么是ThreadLocal
  2. libtool的工作原理
  3. UA MATH567 高维统计II 随机向量4 Frame、凸性与各向同性
  4. js改变css样式_React 中使用CSS的7种方法
  5. electron-vue模仿网易云桌面应用体验
  6. HDU - 6756 Finding a MEX-分块思想
  7. NS2相关学习——可靠的MANET应用程序的Gossip协议分析
  8. C# Winform 窗体美化（四、镂空窗体）
  9. 如何安装mysql5.7.2_CentOS 7.2 安装MySQL 5.7
  10. 解题：ZJOI 2006 书架
  11. 《Windows Server 2012 Hyper-V虚拟化管理实践》——2.3　Hyper-V角色安装后的状态
  12. 通达信最新 行情服务器,通达信行情服务器数据
  13. wps页眉怎么设置不同页码_如何设置 页眉页脚和页码
  14. 计算机系统应用属于ei,2018年度中心成员发表论文清单（SCI、EI收录）
  15. 添加打印机无法搜索计算机,添加打印机搜索不到打印机怎么办
  16. pytorch GPU版安装 与N卡显卡驱动升级 踩坑
  17. java输出pdf(pdfptable和pdftcell)
  18. 保时捷卡宴Cayenne升级原厂360全景影像系统，行车更安全
  19. 人工智能软件怎么开发
  20. 2023年全国最新会计专业技术资格精选真题及答案36

热门文章

  1. win环境sftp软件_WinSCP中文版
  2. 小学奥数 7827 质数的和与积 python
  3. 适用所有服务器的全站301重定向跳转教程
  4. nginx location 斜杠_【一点资讯】斜杠青年双·11买什么本最划算？光影精灵6让你做“多面娇娃” www.yidianzixun.com...
  5. python3萌新入门笔记_我的Python3萌新入门笔记
  6. MySQL笔记-group by和聚合函数的使用
  7. Qt笔记-桌面应用程序加载字体库（ttf）
  8. Qt多线程-QThreadPool线程池与QRunnable
  9. android 队列执行动画,Android 重学系列 渲染图层-图元缓冲队列初始化
  10. java获取keyvault_教程：在 Java Spring Boot 应用中使用 Azure 应用程序配置 Key Vault 引用 | Microsoft Docs...