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 相关文章推荐
HTML中Select不用Disabled实现ReadOnly的效果
Apr 07 Javascript
JavaScript实现继承的4种方法总结
Oct 16 Javascript
angularJS 入门基础
Feb 09 Javascript
JS给超链接加确认对话框的方法
Feb 24 Javascript
jQuery form插件的使用之处理server返回的JSON, XML,HTML数据
Jan 26 Javascript
JS事件添加和移出的兼容写法示例
Jun 20 Javascript
浅谈js内置对象Math的属性和方法(推荐)
Sep 19 Javascript
原生javascript实现的全屏滚动功能示例
Sep 19 Javascript
vue轮播图插件vue-awesome-swiper
Nov 27 Javascript
vue 每次渲染完页面后div的滚动条保持在最底部的方法
Mar 17 Javascript
layui自定义验证,用ajax查询后台是否有重复数据,form.verify的例子
Sep 06 Javascript
如何在wxml中直接写js代码(wxs)
Nov 14 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
php实现文件下载实例分享
2014/06/02 PHP
php使用PDO获取结果集的方法
2017/02/16 PHP
jquery ui bootstrap 实现自定义风格
2014/11/14 Javascript
Jquery的基本对象转换和文档加载用法实例
2015/02/25 Javascript
jquery使用on绑定a标签无效 只能用live解决
2016/06/02 Javascript
解析jQueryEasyUI的使用
2016/11/22 Javascript
详解微信小程序入门五: wxml文件引用、模版、生命周期
2017/01/20 Javascript
Vue from-validate 表单验证的示例代码
2017/09/26 Javascript
Angularjs 手写日历的实现代码(不用插件)
2017/10/18 Javascript
Vue.js划分组件的方法
2017/10/29 Javascript
简单谈谈CommonsChunkPlugin抽取公共模块
2017/12/31 Javascript
vue项目创建并引入饿了么elementUI组件的步骤
2019/04/11 Javascript
JS基础之逻辑结构与循环操作示例
2020/01/19 Javascript
js实现登录时记住密码的方法分析
2020/04/05 Javascript
vue项目打包之开发环境和部署环境的实现
2020/04/23 Javascript
使用JavaScript通过前端发送电子邮件
2020/05/22 Javascript
python 实现插入排序算法
2012/06/05 Python
python重试装饰器示例
2014/02/11 Python
在Python中使用元类的教程
2015/04/28 Python
Python中操作mysql的pymysql模块详解
2016/09/13 Python
使用Python对MySQL数据操作
2017/04/06 Python
python 获取文件下所有文件或目录os.walk()的实例
2018/04/23 Python
pytorch::Dataloader中的迭代器和生成器应用详解
2020/01/03 Python
python实现按键精灵找色点击功能教程,使用pywin32和Pillow库
2020/06/04 Python
Python ellipsis 的用法详解
2020/11/20 Python
Python .py生成.pyd文件并打包.exe 的注意事项说明
2021/03/04 Python
html5使用canvas压缩图片的示例代码
2018/09/11 HTML / CSS
Kickers鞋英国官网:男士、女士和儿童鞋
2021/03/08 全球购物
办公室文秘岗位职责
2013/11/15 职场文书
家长会演讲稿范文
2014/01/10 职场文书
档案检查欢迎词
2014/01/13 职场文书
乡镇纠风工作实施方案
2014/03/22 职场文书
新年主持词
2014/03/27 职场文书
求职导师推荐信范文
2015/03/27 职场文书
遗嘱格式范本
2015/08/07 职场文书
html5中sharedWorker实现多页面通信的示例代码
2021/05/07 Javascript