jquery实现全选和全不选功能效果的实现代码【推荐】


Posted in Javascript onMay 05, 2016

网上好多代码都是错的

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery实现全选和全不选功能效果的实现代码【推荐】</title>
</head>
<script src="jquery-1.7.1.min.js"></script>
<script type="text/javascript">
  $(document).ready(function () {

    $("#checkedAll").click(function () {

      //alert("aa");


      if ($(this).attr("checked")) { // 全选 

        $("input[name='checkbox_name']").each(function () {
          $(this).attr("checked", true);
        });
      }
      else { // 取消全选 

        $("input[name='checkbox_name']").each(function () {
          $(this).attr("checked", false);
        });
      }
    });

  }); 

</script> 

<body>
<input type="checkbox" name="checkbox_name" id="checkbox_name_1" />1<br />
<input type="checkbox" name="checkbox_name" id="checkbox_name_2" />2<br />
<input type="checkbox" name="checkbox_name" id="checkbox_name_3" />3<br />
<input type="checkbox" name="checkbox_name" id="checkbox_name_4" />4<br />
<input type="checkbox" name="checkedAll" id="checkedAll"/>全选/取消全选
</body>
</html>

以上这篇jquery实现全选和全不选功能效果的实现代码【推荐】就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery点击自以外任意处,关闭自身的代码
Feb 10 Javascript
使用firebug进行调试javascript的示例
Dec 16 Javascript
jquery复选框checkbox实现删除前判断
Apr 20 Javascript
js实现字符串的16进制编码不加密
Apr 25 Javascript
超链接的禁用属性Disabled使用示例
Jul 31 Javascript
Javascript中的作用域和上下文深入理解
Jul 03 Javascript
微信小程序 闭包写法详细介绍
Dec 14 Javascript
微信小程序 连续旋转动画(this.animation.rotate)详解
Apr 07 Javascript
详解Angular之constructor和ngOnInit差异及适用场景
Jun 22 Javascript
了解Javascript中函数作为对象的魅力
Jun 19 Javascript
在vue项目中使用sass语法问题
Jul 18 Javascript
node.js中 redis 的安装和基本操作示例
Feb 10 Javascript
jquery实现全选功能效果的实现代码
May 05 #Javascript
ichart.js绘制虚线、平均分虚线效果的实现代码
May 05 #Javascript
animate 实现滑动切换效果【实例代码】
May 05 #Javascript
JavaScript中各种引用类型的常用操作方法小结
May 05 #Javascript
Sea.JS知识总结
May 05 #Javascript
在Node.js中使用Javascript Generators详解
May 05 #Javascript
JavaScript编写检测用户所使用的浏览器的代码示例
May 05 #Javascript
You might like
windows服务器中检测PHP SSL是否开启以及开启SSL的方法
2014/04/25 PHP
PHP大转盘中奖概率算法实例
2014/10/21 PHP
PHP实现的增强性mhash函数
2015/05/27 PHP
js弹窗代码 可以指定弹出间隔
2010/07/03 Javascript
基于jQuery的输入框无值自动显示指定数据的实现代码
2011/01/24 Javascript
ASP.NET jQuery 实例16 通过控件CustomValidator验证RadioButtonList
2012/02/03 Javascript
node.js中的console.trace方法使用说明
2014/12/09 Javascript
鼠标经过子元素触发mouseout,mouseover事件的解决方案
2015/07/26 Javascript
关于事件mouseover ,mouseout ,mouseenter,mouseleave的区别
2015/10/12 Javascript
分享使用AngularJS创建应用的5个框架
2015/12/05 Javascript
jQuery实现页面顶部显示的进度条效果完整实例
2015/12/09 Javascript
js如何判断输入字符串长度
2015/12/16 Javascript
JavaScript里 ==与===区别详解
2016/08/16 Javascript
jQuery自定义插件详解及实例代码
2016/12/29 Javascript
node.js中express-session配置项详解
2017/05/31 Javascript
Angular实现响应式表单
2017/08/04 Javascript
Vue项目中quill-editor带样式编辑器的使用方法
2017/08/08 Javascript
在vue中阻止浏览器后退的实例
2019/11/06 Javascript
JavaScript Tab菜单实现过程解析
2020/05/13 Javascript
[01:15:15]VG VS EG Supermajor小组赛B组胜者组第一轮 BO3第二场 6.2
2018/06/03 DOTA
利用Python脚本在Nginx和uwsgi上部署MoinMoin的教程
2015/05/05 Python
python连接mysql实例分享
2016/10/09 Python
Python多线程编程之多线程加锁操作示例
2018/09/06 Python
pandas.DataFrame删除/选取含有特定数值的行或列实例
2018/11/07 Python
python return逻辑判断表达式实现解析
2019/12/02 Python
最新PyCharm从安装到PyCharm永久激活再到PyCharm官方中文汉化详细教程
2020/11/17 Python
CSS3制作日历实现代码
2012/01/21 HTML / CSS
番木瓜健康和保健产品第一大制造商:Herbal Papaya
2017/04/25 全球购物
欧洲最大的品牌水上运动服装和设备在线零售商:Wuituit Outlet
2018/05/05 全球购物
计算机专业自荐信范文
2014/05/28 职场文书
党员剖析材料范文
2014/09/30 职场文书
2014年政协委员工作总结
2014/12/01 职场文书
公司优秀员工推荐信
2015/03/24 职场文书
事业单位财务人员岗位职责
2015/04/14 职场文书
2016年中秋节晚会领导致辞
2015/11/26 职场文书
Python网络编程之ZeroMQ知识总结
2021/04/25 Python