邮件中全选，不选，反选功能

最新推荐文章于 2023-10-23 14:09:15 发布

杨亚仑

最新推荐文章于 2023-10-23 14:09:15 发布

阅读量398

点赞数

分类专栏： JavaScript学习

本文链接：https://blog.csdn.net/yangyalun/article/details/79854053

版权

JavaScript学习专栏收录该内容

28 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        window.onload=function () {
            var oDiv=document.getElementById("div1");
            var aCh=oDiv.getElementsByTagName("input");
            var oBtn1=document.getElementById("btn1");
            var oBtn2=document.getElementById("btn2");
            var oBtn3=document.getElementById("btn3");

            oBtn1.onclick=function () {
                for(var i=0;i<aCh.length;i++) {
                    aCh[i].checked = true;
                }
            }
            oBtn2.onclick=function () {
                for(var i=0;i<aCh.length;i++) {
                    aCh[i].checked = false;
                }
            }
            oBtn3.onclick=function () {
                for(var i=0;i<aCh.length;i++) {
                    if(aCh[i].checked==true){
                        aCh[i].checked=false;
                    }
                    else {
                        aCh[i].checked=true;
                    }

                }
            }
        }


    </script>
</head>
<body>
<input type="button" value="全选" id="btn1">
<input type="button" value="不选" id="btn2">
<input type="button" value="反选" id="btn3">
<div id="div1">
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
<input type="checkbox"><br>
</div>
</body>
</html>