javascript实现checkbox全选的代码

更新时间：2015年04月30日 09:17:37 投稿：hebedich

本文给大家分享的是js实现checkbox的全选的代码,在网页制作中很常用的js代码,供大家学习参考。

代码：

function checkall(checkNames){
  var allBoxs = document.getElementsByName(checkNames);
  for(var i = 0 ;i<allBoxs.length;i++){
    if(allBoxs[i].type == 'checkbox'){
      if(allBoxs[i].checked==false){
        allBoxs[i].checked = true ;
      }else{
        allBoxs[i].checked = false ;
      }
    }
  }
}

使用方法①

复制代码代码如下:

注意：'goods'是所有需要选中的checkbox的name

使用方法②

<a href="" id="checkAll">全选</a>
<script>
document.getElementById('checkAll').onclick = function () {
  checkall('goods')
};
</script>

注意：'goods'是所有需要选中的checkbox的name

以上2种方法就是本文给大家总结的全部内容了，希望大家能够喜欢，如有更好的方法，也请小伙伴们告之，本文持续更新。

您可能感兴趣的文章:

基于js文件加载优化(详解)
下面小编就为大家分享一篇基于js文件加载优化(详解)，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-01-01
使用console进行性能测试
各大浏览器内置的开发工具，都提供了一个console对象。它主要有两个作用：显示网页代码运行时的错误信息。提供了一个命令行接口，用来与网页代码互动。下面我们就来详细研究下如何使用console进行性能测试。
2015-04-04
移动端手指操控左右滑动的菜单
这篇文章主要为大家详细介绍了移动端手指操控左右滑动的菜单，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2019-09-09
常用的Javascript设计模式小结
javascript设计模式有很多种，本文给大家介绍常用的javascript设计模式，对javascript设计模式相关知识感兴趣的朋友一起学习吧
2015-12-12
微信小程序单选radio及多选checkbox按钮用法示例
这篇文章主要介绍了微信小程序单选radio及多选checkbox按钮用法,结合实例形式分析了微信小程序中单选radio及多选checkbox按钮的选项设置、读取、选中等相关操作技巧,需要的朋友可以参考下
2019-04-04
JavaScript 中this指向问题案例详解
这篇文章主要介绍了JavaScript 中this指向问题案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下
2021-08-08
使用JavaScript根据图片获取条形码的方法
本文重点给大家介绍JavaScript识别图片中的条形码，代码简单易懂，非常不错，具有参考借鉴价值，需要的的朋友参考下吧
2017-07-07
JavaScript操作DOM元素的childNodes和children区别
这篇文章主要介绍了JavaScript操作DOM元素的childNodes和children区别,本文直接给出测试代码和运行效果来讲解它们之间的区别,需要的朋友可以参考下
2015-04-04
js实现显示手机号码效果
本文主要介绍了js实现显示手机号码效果的实例，具有很好的参考价值。下面跟着小编一起来看下吧
2017-03-03
JS堆栈内存的运行机制详解
栈内存主要用于存储各种基本类型的变量，包括Boolean、Number、String、Undefined、Null，以及对象变量的指针（地址值），这篇文章主要介绍了JS堆栈内存的运行机制,需要的朋友可以参考下
2022-06-06