本文目录一览：
- 1、JS代码 做一个简易的购物车 效果图如下
- 2、请教JavaScript中 怎么让购物车的总计价格变化？
- 3、用javascript怎样计算购物车价格
- 4、帮我改一个JS代码谢谢，购物车数字1的时候不能减到0，现在还能减到0
- 5、无刷新修改购物车产品数量得总金额的js代码
- 6、一些电商网站在加入购物车和结算的时候链接显示JavaScript：void（0），为什么要用js来进行提交？
JS代码 做一个简易的购物车 效果图如下
楼主是想要点击合计就是出数值还是什么？如果说点击合计就算出值的话如下
table width="400" border="1"
tr
th rows="5"简易购物车/th
/tr
tr
td商品名称/td
td数量(件)/td
td单价(美元)/td
td运费(美元)/td
tdbutton onclick="fun()"合计/button/td
/tr
tr
tdinput type="text" name="goodsName" //td
tdinput type="text" name="num" id="num" //td
tdinput type="text" name="price" id="price" //td
tdinput type="text" name="freight" id="freight" //td
tdinput type="text" name="total" id="total" //td
/tr
/table
script
function fun(){
var num = document.getElementById("num").value;
var price = document.getElementById("price").value;
var freight = parseInt(document.getElementById("freight").value);
var total = (price * num) + freight;
document.getElementById("total").value = total;
}
/script
请教JavaScript中 怎么让购物车的总计价格变化？
一般有两种做法。
一种是
在页面加载完毕后，先初始化一次总金额。
在调用添加、减少方法时，获取总金额的值然后加上或减去物品*数量的值
另一种就是
同样先初始化总金额
在调用添加、减少方法后，直接重新计算所有price的值然后给总金额赋值。
```js
function updateTotalPrice() {
let count= 0
const priceNodes = document.querySelectorAll("li input[name='price']")
priceNodes.forEach(node = {
count+= parseFloat(node.value) * 100
})
document.querySelector("#totalPrice").innerHTML = count/ 100
}
```
用javascript怎样计算购物车价格
/*计算总价格*/
var totalPrice=0;
for(var a=1;a3;a++){
var quantity=document.getElementById("quantity"+a).value;
var price=document.getElementById("price"+a).value;
var smallTotal=quantity*price;
totalPrice=totalPrice+smallTotal;
}
var total=document.getElementById("total");
total.innerHTML=totalPrice;
}
/script
script type="text/javascript"
function initialize()
{
var totalPrice=0;
for(var a=1;a3;a++){
var quantity=document.getElementById("quantity"+a).value;
var price=document.getElementById("price"+a).value;
var smallTotal=quantity*price;
totalPrice=totalPrice+smallTotal;
/*alert(smallTotal);*/
var smallT=document.getElementById("smallTotal"+a);
smallT.innerHTML=smallTotal;
}
/*取出购物车的所有商品的价格总和*/
var total=document.getElementById("total");
total.innerHTML=totalPrice;
}
/script
style type="text/css"
#imgtest {
position: absolute;
top: 100px;
left: 400px;
z-index: 1;
}
table {
left: 100px;
font-size: 20px;
}
/style
/head
body onload="initialize()"
div id="imgtest"/div
br /
br /
table border="1" style="text-align: center;" align="center"
thead style="height: 50"
td style="WIDTH: 300px"
商品名称
/td
td style="WIDTH: 60px"
图片
/td
td style="WIDTH: 170px"
数量
/td
td style="WIDTH: 170px"
价格
/td
td style="WIDTH: 250px"
小计
/td
/thead
tbody
tr
td class="name"商品1/td
td class="image"
img src="1.jpg" width="40px" height="40px" id="image1" /
/td
td class="quantity"
input id="quantity1" value="1" onblur="total(1);" /
/td
td class="price"
input type="hidden" id="price1" value="20" /
20
/td
td class="total"
span id="smallTotal1"/span 元
/td
/tr
tr
td class="name"商品2/td
td class="image"
img src="1.jpg" width="40px" height="40px" id="image1" /
/td
td class="quantity"
input id="quantity2" value="2" onblur="total(2);" /
/td
td class="price"
input type="hidden" id="price2" value="30" /
30
/td
td class="total"
span id="smallTotal2"/span 元
/td
/tr
tr
td colspan="4" class="cart_total"
br
/td
td
span class="red"总计:/spanspan id="total"/span 元
/td
/tr
/tbody
/table
/body
/html
帮我改一个JS代码谢谢，购物车数字1的时候不能减到0，现在还能减到0
我觉得应该大概是这样:
if(operat==1){
//加1处理...
}
else{
if (num = 1) return false;
//减1处理...
}
无刷新修改购物车产品数量得总金额的js代码
用你给的代码基础上用了一个最简单的js计算，数量是键盘输入，也可以在左右两侧加上自增减的操作，望采纳！
table width="500" border="0" cellpadding="5" cellspacing="0"
trtd数量/tdtd单价/td/tr
tr
tdinput type="text" id="num" value="1" size="5" onchange="setTotal();"//td
tdspan id="fare"6.00/span元/td
/tr
tr
td /td
td总金额：￥:span id="total_Price"6/span.00/td
/tr
/table
p数量那里最好能键盘输入，不然买100件就有的点了。麻烦再给看看哈/p
script type="text/JavaScript"
function setTotal(){
var fare=document.getElementById("fare").innerHTML;
//alert(fare);
var num=document.getElementById("num").value;
if(/\D/.test(num)){//检查用户输入的值是否是数字
alert("请您输入正确的数量！");
document.getElementById("total_Price").innerHTML="0"
}else{
document.getElementById("total_Price").innerHTML=parseFloat(fare*num);
}
}
/script
一些电商网站在加入购物车和结算的时候链接显示JavaScript：void（0），为什么要用js来进行提交？
为了更好的用户体验和安全方面的考虑. 在加入购物车的时候, 一般是用ajax做的, 那么如果不用ajax做的话, 你点击加入购物车, 那么就直接跳到购物车界面去了, 这对用户体验其实并不好, 因为用户可能还想逛逛, 还想买东西.
结算的时候也是使用ajax, 为什么, 因为结算页面并不是死的页面, 有可能用户还要调一下商品数量啊, 再选一下款式啊什么的, 这个时候你用ajax在本页面进行数据的交换 , 就比不停的刷新页面要好的多.
