javascript学习实录之八（计算所选商品总价值） -- 刘小小尘

最新推荐文章于 2022-12-24 22:01:36 发布

刘啸尘-勤奋的小小尘

最新推荐文章于 2022-12-24 22:01:36 发布

阅读量1k

点赞数

分类专栏： javascript 学习实录 javascript

本文链接：https://blog.csdn.net/liuxiaochen123/article/details/8917711

版权

javascript 学习实录同时被 2 个专栏收录

11 篇文章 0 订阅

订阅专栏

javascript

9 篇文章 0 订阅

订阅专栏

直接上代码，很简单，当你选择商品后，计算商品的总价值

<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
    <title></title>
    <script type="text/javascript">
        function getSum() {
            var item = document.getElementsByName("item")
            var sum = 0;
            for(var x=0; x < item.length; x++) {
                if(item[x].checked) {
                    sum += parseInt(item[x].value);
                }
            }
            var spanNode = document.getElementById("sum");
            str = sum + "元";
            spanNode.innerHTML = str.fontsize(7);
        }
        function checkAll() {
            var checkA = document.getElementsByName("all")[0];
            var item = document.getElementsByName("item")
                for(var x=0; x < item.length; x++) {
                   item[x].checked = checkA.checked ;
                }
        }
    </script>
</head>
<body>
    <input type="checkbox" name="all" οnclick="checkAll()"> 全选 <br/>
    <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />
    <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />
    <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />
    <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />
    <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />
    <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />
    <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />
    <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />
    <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />

    <input type="button" value="获得总金额" οnclick="getSum()"> <span id="sum"></span>
</body>
</html>