全选和反选Demo

最新推荐文章于 2023-09-24 10:00:00 发布

kerer-sk

最新推荐文章于 2023-09-24 10:00:00 发布

阅读量820

点赞数

分类专栏： JavaScript Demo小程序

本文链接：https://blog.csdn.net/u010512964/article/details/72628031

版权

JavaScript 同时被 2 个专栏收录

7 篇文章 0 订阅

订阅专栏

Demo小程序

3 篇文章 0 订阅

订阅专栏


<script type="text/javascript">
    function checkAll(){
        // 找到所有选项
        var items = document.getElementsByName("item");
        // 找到全选按钮的对象
        var allNode = document.getElementsByName("all")[0];
        for(var i=0;i<items.length;i++){
            items[i].checked = allNode.checked;
        }
    }

    function getSum(){
        // 找到所有选项
        var items = document.getElementsByName("item");
        var sum = 0;
        for(var i=0;i<items.length;i++){
            if(items[i].checked){
                sum+=parseInt(items[i].value);
            }
        }
        var spanNode = document.getElementById("sumid");
        spanNode.innerHTML = ("&nbsp &nbsp &nbsp &yen &nbsp"+sum).fontcolor("green");

    }
</script>
<body>

   <div>商品列表</div>
   <input type="checkbox" name="item" value="1000"/>商品1<br/>
   <input type="checkbox" name="item" value="1000"/>商品2<br/>
   <input type="checkbox" name="item" value="1000"/>商品3<br/>
   <input type="checkbox" name="item" value="1000"/>商品4<br/>

   <input type="checkbox" name="all" onclick="checkAll()"/>全选<br/>
   <input type="button" value="总金额:" onclick="getSum()"/><span id="sumid"></span>
 </body>

kerer-sk

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
全选和反选Demo

<script type="text/javascript"> function checkAll(){ // 找到所有选项 var items = document.getElementsByName("item"); // 找到全选按钮的对象 var allNode = document.getElementsByName(
复制链接

扫一扫