原生js实现选中所有的checkbox

weixin_30809173

于 2017-09-20 14:42:00 发布

阅读量618

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/peko/p/7561412.html

<div class="con">
 <input name='多选项名称' type='checkbox' value='' id="all" onclick="cli('cc');"> 全选  
<input name='cc' type='checkbox' value='' > A  
<input name='cc' type='checkbox' value='' > B  
<input name='cc' type='checkbox' value='' > C  
<input name='cc' type='checkbox' value='' > D  
<input name='cc' type='checkbox' value='' > E  
<input name='cc' type='checkbox' value='' > F 
</div>

<script type="text/javascript">
function cli (obj) {
    let chill = document.getElementById('all')
    let chilles = document.getElementsByName(obj)
    if (chill.checked) {
    for (let i = 0; i < chilles.length; i++) {
      chilles[i].checked = true
    }
} else {
    for (let i = 0; i < chilles.length; i++) {
      chilles[i].checked = false
    }
  }
}

原生js实现选中所有的checkbox。需要给所有的input标签写上专属的name。getElementsByName() 方法可返回带有指定名称的对象的集合。查询元素的 name 属性。

转载于:https://www.cnblogs.com/peko/p/7561412.html