用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 相关文章推荐
js的event详解。
Sep 06 Javascript
Function.prototype.call.apply结合用法分析示例
Jul 03 Javascript
Javascript 学习笔记之 对象篇(二) : 原型对象
Jun 24 Javascript
利用a标签自动解析URL分析网址实例
Oct 20 Javascript
JavaScript将XML转成JSON的方法
Mar 12 Javascript
Java File类的常用方法总结
Mar 18 Javascript
jQuery validate验证插件使用详解
May 11 Javascript
JavaScript闭包实例详解
Jun 03 Javascript
jQuery Plupload上传插件的使用
Apr 19 jQuery
如何获取vue单文件自身源码路径
May 06 Javascript
浅谈实现在线预览PDF的几种解决办法
Aug 10 Javascript
vue3.0中使用element的完整步骤
Mar 04 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
PHP中上传大体积文件时需要的设置
2006/10/09 PHP
php的$_FILES的临时储存文件与回收机制实测过程
2013/07/12 PHP
PHP OPP机制和模式简介(抽象类、接口和契约式编程)
2014/06/09 PHP
PHP+jQuery 注册模块的改进(三):更新到Smarty3.1
2014/10/14 PHP
php+mysql查询实现无限下级分类树输出示例
2016/10/03 PHP
用javascript实现自定义标签
2007/05/08 Javascript
JavaScript 页面坐标相关知识整理
2010/01/09 Javascript
javascript之典型高阶函数应用介绍二
2013/01/10 Javascript
Array栈方法和队列方法的特点说明
2014/01/24 Javascript
JavaScript类型系统之正则表达式
2016/01/05 Javascript
浅析在javascript中创建对象的各种模式
2016/05/06 Javascript
常用的js验证和数据处理总结
2016/08/02 Javascript
jquery.Jcrop结合JAVA后台实现图片裁剪上传实例
2016/11/05 Javascript
bootstrap table单元格新增行并编辑
2017/05/19 Javascript
原生js获取left值和top值的三种方法
2017/08/02 Javascript
vue-cli axios请求方式及跨域处理问题
2018/03/28 Javascript
如何在js代码中消灭for循环实例详解
2018/07/29 Javascript
layui switch 开关监听 弹出确定状态转换的例子
2019/09/21 Javascript
layui 数据表格+分页+搜索+checkbox+缓存选中项数据的方法
2019/09/21 Javascript
JavaScript装饰者模式原理与用法实例详解
2020/03/09 Javascript
深入了解Vue.js 混入(mixins)
2020/07/23 Javascript
Python中关键字nonlocal和global的声明与解析
2017/03/12 Python
Python 类的继承实例详解
2017/03/25 Python
修改python plot折线图的坐标轴刻度方法
2018/12/13 Python
Flask框架学习笔记之表单基础介绍与表单提交方式
2019/08/12 Python
PyCharm+Pipenv虚拟环境开发和依赖管理的教程详解
2020/04/16 Python
利用4行Python代码监测每一行程序的运行时间和空间消耗
2020/04/22 Python
Proenza Schouler官方网站:纽约女装和配饰品牌
2019/01/03 全球购物
大学生入党自我鉴定
2013/10/31 职场文书
办公室经理岗位职责
2014/01/01 职场文书
商务英语大学生职业生涯规划书范文
2014/01/01 职场文书
会计职业生涯规划范文
2014/01/04 职场文书
研究生毕业鉴定
2014/01/29 职场文书
《太阳》教学反思
2014/02/21 职场文书
小学生国旗下演讲稿
2014/04/25 职场文书
奥特曼十大神器:奥特手镯在榜,第一是贝利亚的神器
2022/03/18 日漫