JavaScript特效--全选与反选

最新推荐文章于 2024-04-26 16:47:03 发布

goldlive_8888

最新推荐文章于 2024-04-26 16:47:03 发布

阅读量374

点赞数

文章标签： javascript input function button html

本文链接：https://blog.csdn.net/goldlive_8888/article/details/2407403

版权

<html>
   <head>
    <script type="text/javascript">
         function selectAllID(){
            var allSel = document.getElementsByName("id");
            var selectAll = document.getElementById("selectAll");
            var ch = selectAll.checked;
            for(var i=0;i<allSel.length;i++){
              allSel[i].checked = ch;
            }
         }
         function showResult(){
            var chkbox = document.getElementsByName("id");
        var id;
            for(var i=0;i < chkbox.length; i++){
             if(chkbox[i].checked){
                id += (id==""?"":",") + chkbox[i].value;
             }
            }
          alert(id);
         }
      </script>
   </head>
    <body>
       <input type="checkbox" id="selectAll" οnclick="javascript:selectAllID();"/>
       全选
       <input type="button" value="显示结果" οnclick="showResult()"><br>
       <input type="checkbox" name="id" value="4256" >选项1<br>
       <input type="checkbox" name="id" value="4546" >选项2<br>
       <input type="checkbox" name="id" value="4556" >选项3<br>
       <input type="checkbox" name="id" value="4456" >选项4<br>
       <input type="checkbox" name="id" value="356" >选项5<br>
       <input type="checkbox" name="id" value="4256" >选项6<br>
       <input type="checkbox" name="id" value="4356" >选项7<br>
       <input type="checkbox" name="id" value="156" >选项8<br>
       <input type="checkbox" name="id" value="456" >选项9<br>
       <input type="checkbox" name="id" value="4346" >选项10<br>
       <input type="checkbox" name="id" value="8756" >选项11
   </body>
</html>

goldlive_8888

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript特效--全选与反选

function selectAllID(){ var allSel = document.getElementsByName("id"); var selectAll = document.getElementById("selectAll"); var ch = selectAll.chec
复制链接

扫一扫