用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 相关文章推荐
用javascript实现的支持lrc歌词的播放器
May 17 Javascript
使用js操作css实现js改变背景图片示例
Mar 10 Javascript
ExtJS4给Combobox设置列表中的默认值示例
May 02 Javascript
javascript模块化简单解析
Apr 07 Javascript
JS简单实现点击复制链接的方法
Aug 03 Javascript
vue按需引入element Transfer 穿梭框
Sep 30 Javascript
微信小程序排坑指南详解
May 23 Javascript
基于JavaScript实现瀑布流布局
Aug 15 Javascript
vue 根据数组中某一项的值进行排序的方法
Aug 30 Javascript
angular6 利用 ngContentOutlet 实现组件位置交换(重排)
Nov 02 Javascript
浅谈layui使用模板引擎动态渲染元素要注意的问题
Sep 14 Javascript
vue中利用three.js实现全景图的完整示例
Dec 07 Vue.js
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
用mysql触发器自动更新memcache的实现代码
2009/10/11 PHP
基于PHP异步执行的常用方式详解
2013/06/03 PHP
php 从指定数字中获取随机组合的简单方法(推荐)
2017/04/05 PHP
Laravel 5.5 的自定义验证对象/类示例代码详解
2017/08/29 PHP
PHP 中 var_export、print_r、var_dump 调试中的区别
2018/06/19 PHP
浅谈PHP各环境下的伪静态配置
2019/03/13 PHP
php写app用的框架整理
2019/09/29 PHP
Firebug 字幕文件JSON地址获取代码
2009/10/28 Javascript
JS 对象介绍
2010/01/20 Javascript
jQuery中add实现同时选择两个id对象
2010/10/22 Javascript
推荐30个新鲜出炉的精美 jQuery 效果
2012/03/26 Javascript
屏蔽网页右键复制和ctrl+c复制的js代码
2013/01/04 Javascript
javascript编码的几个方法详细介绍
2013/01/06 Javascript
getComputedStyle与currentStyle获取样式(style/class)
2013/03/19 Javascript
借助JavaScript脚本判断浏览器Flash Player信息的方法
2014/07/09 Javascript
JS实现网站菜单拖拽移位效果的方法
2015/09/24 Javascript
详解javascript中原始数据类型Null和Undefined
2015/12/17 Javascript
javascript html实现网页版日历代码
2016/03/08 Javascript
轻松实现js弹框显示选项
2016/09/13 Javascript
javascript加载xml 并解析各节点的值(实现方法)
2016/10/12 Javascript
jQuery实现可移动选项的左右下拉列表示例
2016/12/26 Javascript
jQuery插件JWPlayer视频播放器用法实例分析
2017/01/11 Javascript
Vue不能检测到Object/Array更新的情况的解决
2018/06/26 Javascript
nodejs初始化init的示例代码
2018/10/10 NodeJs
Vue 中如何将函数作为 props 传递给组件的实现代码
2020/05/12 Javascript
[00:12]2018DOTA2亚洲邀请赛 Sccc亮相SOLO赛,今年他又会有什么样的战绩?
2018/04/06 DOTA
Python文件右键找不到IDLE打开项解决办法
2015/06/08 Python
Python装饰器实现方法及应用场景详解
2020/03/26 Python
Python如何将函数值赋给变量
2020/04/28 Python
HTML5自定义属性的问题分析
2019/08/16 HTML / CSS
怎么写好自荐书
2014/03/02 职场文书
甘南现象心得体会
2014/09/11 职场文书
保安2014年终工作总结
2014/12/06 职场文书
2016年校园重阳节广播稿
2015/12/18 职场文书
教你用python实现一个无界面的小型图书管理系统
2021/05/21 Python
Valheim服务器 Mod修改安装教程 【ValheimPlus】
2022/12/24 Servers