JS实现“全选”和"全不选"功能代码实例
作者:西红柿里没有番茄
这篇文章主要介绍了JS实现“全选”和"全不选"功能代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
这篇文章主要介绍了JS实现“全选”和"全不选"功能代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
代码如下
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<script>
  function clickon() {
    // 获取到body中所有checkbox
    var checkbox = document.querySelectorAll("input[type='checkbox']");
    for (var i = 0; i < checkbox.length; i++) {
      checkbox[i].checked = true;
    }
  }
  function unclick() {
    var checkbox = document.querySelectorAll("input[type='checkbox']");
    for (var i = 0; i < checkbox.length; i++) {
      checkbox[i].checked = false;
    }
  }
</script>
<body>
<form>
  <input type="checkbox">吃
  <input type="checkbox">喝
  <input type="checkbox">拉
  <input type="checkbox">撒
  <input type="button" value="全选" onclick="clickon()">
  <input type="button" value="全不选" onclick="unclick()">
</form>
</body>
</html>
效果

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
