用JQuery实现全选与取消的两种简单方法


Posted in Javascript onFebruary 22, 2014

用JQUERY实现全选和取消全选,没有js那么繁琐,而且支持更多浏览器。

<mce:script type="text/javascript"><!--$(function() {  
    $("#checkall").click(function() {  
        $("input[@name='checkname[]']").each(function() {  
            $(this).attr("checked", true); 
        }); 
    }); 
    $("#delcheckall").click(function() {  
        $("input[@name='checkname[]']").each(function() {  
            $(this).attr("checked", false); 
        }); 
    }); 
}); 
// --></mce:script> 
<input type='checkbox' id='id1' name='checkname[]' value='1' />value1  
<input type='checkbox' id='id2' name='checkname[]' value='2' />value2 
<input type='checkbox' id='id3' name='checkname[]' value='3' />value3 
<input type="button" id="checkall" name="checkall" value="全选" /> 
<input type="button" id="delcheckall" name="delcheckall" value="取消全选" />

更加简单的一种:
$("#checkall").click( 
  function(){ 
    if(this.checked){ 
        $("input[name='checkname']").attr('checked', true)
    }else{ 
        $("input[name='checkname']").attr('checked', false)
    } 
  } 
);
Javascript 相关文章推荐
JQuery与iframe交互实现代码
Dec 24 Javascript
jquery滚动加载数据的方法
Mar 09 Javascript
初识angular框架后的所思所想
Feb 19 Javascript
BootStrap Table 设置height表头与内容无法对齐的问题
Dec 28 Javascript
在点击div中的p时,如何阻止事件冒泡
Feb 07 Javascript
JS变量及其作用域
Mar 29 Javascript
基于原生js运动方式关键点的总结(推荐)
Oct 01 Javascript
vue将对象新增的属性添加到检测序列的方法
Feb 24 Javascript
关于js对textarea换行符的处理方法浅析
Aug 03 Javascript
vue里如何主动销毁keep-alive缓存的组件
Mar 21 Javascript
基于Vue CSR的微前端实现方案实践
May 27 Javascript
如何配置vue.config.js 处理static文件夹下的静态文件
Jun 19 Javascript
jquery实现checkbox 全选/全不选的通用写法
Feb 22 #Javascript
防止jQuery ajax Load使用缓存的方法小结
Feb 22 #Javascript
jquery中load方法的用法及注意事项说明
Feb 22 #Javascript
页面加载完成后再执行JS的jquery写法以及区别说明
Feb 22 #Javascript
解决用jquery load加载页面到div时,不执行页面js的问题
Feb 22 #Javascript
文本框水印提示效果的简单实现代码
Feb 22 #Javascript
jquery实现省市select下拉框的替换(示例代码)
Feb 22 #Javascript
You might like
Eclipse的PHP插件PHPEclipse安装和使用
2014/07/20 PHP
PHP的Yii框架入门使用教程
2016/02/15 PHP
基于Laravel 5.2 regex验证的正确写法
2019/09/29 PHP
jQuery EasyUI API 中文文档 - NumberBox数字框
2011/10/13 Javascript
五段实用的js高级技巧
2011/12/20 Javascript
JS 对输入框进行限制(常用的都有)
2013/07/30 Javascript
使用JavaScript脚本判断页面是否在微信中被打开
2016/03/06 Javascript
js操作XML文件的实现方法兼容IE与FireFox
2016/06/25 Javascript
微信小程序之仿微信漂流瓶实例
2016/12/09 Javascript
微信小程序Server端环境配置详解(SSL, Nginx HTTPS,TLS 1.2 升级)
2017/01/12 Javascript
node.js实现登录注册页面
2017/04/08 Javascript
Node.js服务器开启Gzip压缩教程
2017/08/11 Javascript
D3.js实现拓扑图的示例代码
2018/06/30 Javascript
JS实现的input选择图片本地预览功能示例
2018/08/29 Javascript
vue-cli3搭建项目的详细步骤
2018/12/05 Javascript
小程序扫描普通链接二维码跳转小程序指定界面方法
2019/05/07 Javascript
vue+elementUI(el-upload)图片压缩,默认同比例压缩操作
2020/08/10 Javascript
[14:21]VICI vs EG (BO3)
2018/06/07 DOTA
python使用os模块的os.walk遍历文件夹示例
2014/01/27 Python
Python实现Const详解
2015/01/27 Python
Python程序中用csv模块来操作csv文件的基本使用教程
2016/03/03 Python
python利用正则表达式排除集合中字符的功能示例
2017/10/10 Python
Python标准库笔记struct模块的使用
2018/02/22 Python
Python 文本文件内容批量抽取实例
2018/12/10 Python
python下载微信公众号相关文章
2019/02/26 Python
正则给header的冒号两边参数添加单引号(Python请求用)
2019/08/09 Python
PyCharm取消波浪线、下划线和中划线的实现
2020/03/03 Python
Django web自定义通用权限控制实现方法
2020/11/24 Python
美国Curacao百货连锁店网站:iCuracao.com
2019/07/20 全球购物
自荐信格式范文
2013/10/07 职场文书
美丽乡村建设实施方案
2014/03/23 职场文书
幼儿园中班班级总结
2015/08/10 职场文书
职场:企业印章管理制度(模板)
2019/10/18 职场文书
Python手拉手教你爬取贝壳房源数据的实战教程
2021/05/21 Python
Redis监控工具RedisInsight安装与使用
2022/03/21 Redis
JS class语法糖的深入剖析
2022/07/07 Javascript