用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 相关文章推荐
不错的新闻标题颜色效果
Dec 10 Javascript
潜说js对象和数组
May 25 Javascript
更换select下拉菜单背景样式的实现代码
Dec 20 Javascript
jquery实现仿Flash的横向滑动菜单效果代码
Sep 17 Javascript
基于javascript实现按圆形排列DIV元素(一)
Dec 02 Javascript
vue引入swiper插件的使用实例
Jul 19 Javascript
bootstrap fileinput实现文件上传功能
Aug 23 Javascript
如何快速解决JS或Jquery ajax异步跨域的问题
Jan 08 jQuery
原生JS实现简单的倒计时功能示例
Aug 30 Javascript
JavaScript中Array方法你该知道的正确打开方法
Sep 11 Javascript
详解JavaScript的内存空间、赋值和深浅拷贝
Apr 17 Javascript
Vue中UI组件库之Vuex与虚拟服务器初识
May 07 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
优化php效率,提高php性能的一些方法
2011/03/24 PHP
PHP中的Trait 特性及作用
2016/04/03 PHP
php制作简单模版引擎
2016/04/07 PHP
浅谈PHP面向对象之访问者模式+组合模式
2017/05/22 PHP
PHP 记录访客的浏览信息方法
2018/01/29 PHP
用YUI做了个标签浏览效果
2007/02/20 Javascript
Javascript 继承机制的实现
2009/08/12 Javascript
Mootools 图片展示插件(lightbox,ImageMenu)收集集合
2010/05/21 Javascript
如何在父窗口中得知window.open()出的子窗口关闭事件
2013/10/15 Javascript
JavaScript DSL 流畅接口(使用链式调用)实例
2015/03/15 Javascript
JQuery中DOM实现事件移除的方法
2015/06/13 Javascript
JS实现的在线调色板实例(附demo源码下载)
2016/03/01 Javascript
AngularJS Bootstrap详细介绍及实例代码
2016/07/28 Javascript
jQuery插件JWPlayer视频播放器用法实例分析
2017/01/11 Javascript
jquery表单验证实例仿Toast提示效果
2017/03/03 Javascript
老生常谈js中0到底是 true 还是 false
2017/03/08 Javascript
分析JS中this引发的bug
2017/12/12 Javascript
Javascript Web Worker使用过程解析
2020/03/16 Javascript
VueQuillEditor富文本上传图片(非base64)
2020/06/03 Javascript
[51:22]Fnatic vs IG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
Python OpenCV 直方图的计算与显示的方法示例
2018/02/08 Python
Python实现正整数分解质因数操作示例
2018/08/01 Python
详解Python中pandas的安装操作说明(傻瓜版)
2019/04/08 Python
利用anaconda保证64位和32位的python共存
2021/03/09 Python
Python同时迭代多个序列的方法
2020/07/28 Python
Python判断变量是否是None写法代码实例
2020/10/09 Python
html5使用canvas画空心圆与实心圆
2014/12/15 HTML / CSS
高中微机老师自我鉴定
2014/02/16 职场文书
企业员工培训感言
2014/02/26 职场文书
国家税务局干部作风整顿整改措施
2014/09/18 职场文书
2014年标准化工作总结
2014/12/17 职场文书
乌镇导游词
2015/02/02 职场文书
闪闪红星观后感
2015/06/08 职场文书
Python进阶学习之带你探寻Python类的鼻祖-元类
2021/05/08 Python
原生JS实现飞机大战小游戏
2021/06/09 Javascript
JavaScript实现简单计时器
2021/06/22 Javascript