通过复选框计算总价

<html>

<!--用户每选中一个复选框,就表示用户选定与之关联的商品,脚本程序立即算出所有选定商品的总金额,并显示在总价格区域中。
  如果用户取消先前选择的某件商品,脚本程序应立即从总金额中减去该商品的价格。-->
 
<head>
    <title>Untitled Page</title>
    <script language="javascript">
        //document.form1.elements["writer"][i]
        //document.form1.elements["writer",i]
        //document.form1.writer[i] 三者是等价的
        function CheckSum() {
            var sum = 0;
            for (var i = 0; i < document.form1.elements["writer"].length; i++) {
                if (document.form1.elements["writer"][i].checked) {
                    sum = sum + parseInt(document.form1.elements["writer"][i].value);
                }
            }
            totalprice.innerHTML = sum + "元";
        }
    </script>
   
</head>
<body>

<form action="" method="post" name="form1">
  <input type="checkbox" name="writer" value=10 />橡皮檫(10元)<br />
  <input type="checkbox" name="writer" value=20 />铅笔(20元)<br />
  <input type="checkbox" name="writer" value=30 />圆珠笔(30元)<br />
  <input type="checkbox" name="writer" value=40 />签字笔(40元)<br />
  <input type="checkbox" name="writer" value=50 />钢笔(50元)<br />
  <input type="submit" name="submit1" value=Submit id="submit1" /><br />
  总价为:<span id="totalprice">0元</span>
</form>


</body>
</html>
 

你可能感兴趣的:(JavaScript,js,Web,职场,休闲)