您的位置 首页 技术

JavaScript如何实现“全选”和"全不选"功能?(代码示例)

本篇文章给大家介绍一下使用JavaScript实现“全选”和"全不选"功能的方法,文中通过示例代码介绍的非常详细。有一定的参考价值,有需要的朋友可以参考一下,希…

本篇文章给大家介绍一下使用JavaScript实现“全选”和"全不选"功能的方法,文中通过示例代码介绍的非常详细。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

代码如下

<!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>

效果

更多jQuery、Javascript特效,推荐访问:js特效大全!

以上就是JavaScript如何实现“全选”和"全不选"功能?(代码示例)的详细内容,更多请关注24课堂在线网其它相关文章!

本文来自网络,不代表24小时课堂在线立场,转载请注明出处:https://www.24ketang.cn/79351.html

为您推荐

返回顶部