<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>购物车复选框的选中 反选的案例</title> </head> <body> All <input class="all" name="Checkbox" type="checkbox"> <ul> <div class="checkbox-list"> <input name="Checkbox" type="checkbox" > <input name="Checkbox" type="checkbox" > <input name="Checkbox" type="checkbox"> </div> </ul> <script> let all = document.querySelector('.all') let every = document.querySelectorAll('.checkbox-list input') console.log(every) //大复选框选中 小的全部选中 all.addEventListener('click',function(){ for (let i = 0; i < every.length; i++) { every[i].checked = this.checked } }) //下面小的 如果全选 那么 大复选框也选中 for (let i = 0; i < every.length; i++) { every[i].addEventListener('click',function(){ for (var j = 0; j < every.length; i++) { if(every[j].checked != true){ all.checked = false return true }else{ all.checked = true return true } } }) } </script> </body> </html>
标签:checked,反选,购物车,every,选中,let,复选框,true From: https://www.cnblogs.com/xm666/p/17805587.html