帮我作业网

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 2932|回复: 0

如何用js实现计算机毕业设计里购物车的商品价格自动加减

[复制链接]
发表于 2017-10-3 09:45:33 | 显示全部楼层 |阅读模式
免费网页设计制作作业成品下载
同学们在做计算机毕业设计的时候,很多人选择了当下比较热的电子商务系统,在做电子商务系统中有个购物车页面,需要使用复选框,选中对应产品,下方能够自动出现商品价格的综合,帮我工作网,给马上要做毕业设计的同学们分享一段实现购物车功能的js:代码

具体的效果如下:

具体的代码为:
var priceSum;

window.onload = function () {

priceSum = 0;

Init();

}

function Init() {

//box 下所有的 input 标签元素

var checks = document.getElementById("box").getElementsByTagName("input");

priceSum = 0;//初始化价格

for (var i = 0; i < checks.length; i++) {//遍历标签

//如果是复选框并且为选中状态

if (checks.type == "checkbox" && checks.checked) {

priceSum += parseFloat(checks.value);//累加价格,parseFloat 转换为浮点型数值

}

}

document.getElementById("price").innerHTML = "价格 " + priceSum + "元";

}

//复选框的 onclick 事件也可以直接绑定为 Init(),就是耗效率

function updateSum(chk) {

if (chk.checked) {//为选中状态,当前总价加上该复选框的值

priceSum += parseFloat(chk.value);

} else {//否则减少该值

priceSum -= parseFloat(chk.value);

}

document.getElementById("price").innerHTML = "价格 " + priceSum + "元";

}

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|帮我作业网

GMT+8, 2020-1-24 13:09 , Processed in 0.087722 second(s), 19 queries .

Powered by 85work!

© 2001-2013 85work.

快速回复 返回顶部 返回列表