购物车页面

来源：互联网发布：阿里云80端口不能访问编辑：程序博客网时间：2024/04/29 22:27
这个项目中觉得js写的最头痛的地方。因为不是所有的购物车都选中，可以选择某几个购物车进行变化。
并且除了加、减购物项需要进行数据库外，其他都是页面进行操作，价格以整形进行计算，在除以100
<html><head><%@ include file="/framework/core/jsp/commonJs.jsp" %><script type="text/javascript">//减少数量function delItem(id) {var buyNum = $("#buyNum"+id).val();if(buyNum == 1){alert("选购的商品不能小于1件");return;}var url = "${path}/or/shopCart/update";var params = {"id" : id, "buyNum" : (buyNum-1)};$.post(url,params,function(data){if (eval("("+data+")")) {var salePriceId = "salePrice" + id;var flag =$("#checkbox" + id).is(":checked");if (flag) {//改变总量var totalPriceId = "totalPrice";$("#totalPrice").text(countPrice(totalPriceId, salePriceId, false));$("#totalNum").text($("#totalNum").text()*1 - 1);}//改变单项的价格var sumPriceId = "sumPrice" + id;$("#sumPrice"+id).text(countPrice(sumPriceId, salePriceId, false));$("#buyNum"+id).val(buyNum - 1);}});}//增加数量function addItem(id, limit) {var buyNum = $("#buyNum"+id).val();//检测库存if((buyNum*1+1) > limit){alert("该商品的库存为：" + limit + "，无法再增加购买量");return;}var url = "${path}/or/shopCart/update";var params = {"id" : id, "buyNum" : (buyNum*1 + 1)};$.post(url, params, function(data){if (eval("("+data+")")) {var salePriceId = "salePrice" + id;var flag =$("#checkbox" + id).is(":checked");if (flag) {var totalPriceId = "totalPrice";$("#totalPrice").text(countPrice(totalPriceId, salePriceId, true));$("#totalNum").text($("#totalNum").text()*1 + 1);}var sumPriceId = "sumPrice" + id;$("#sumPrice"+id).text(countPrice(sumPriceId, salePriceId, true));$("#buyNum"+id).val(buyNum*1 + 1);}});}//删除购物项function removeItem(id) {//询问框var url = "${path}/or/shopCart/delete";var params = {"id" : id};$.post(url, params, function(data){setTimeout("location.reload();",2000);});}//选中，取消多选框发送的变化function checkedOpt(id) {var totalPriceId = "totalPrice";var sumPriceId = "sumPrice" + id;var buyNum = $("#buyNum"+id).val();var flag =$("#checkbox" + id).is(":checked");if(flag){$("#totalPrice").text(countPrice(totalPriceId, sumPriceId, true));$("#totalNum").text($("#totalNum").text()*1 + buyNum*1);} else {$("#totalPrice").text(countPrice(totalPriceId, sumPriceId, false));$("#totalNum").text($("#totalNum").text()*1 - buyNum*1);}}//在页面上进行价格计算,currentPrice:原价格,changePrice:改变金额,orientation:金额改变流向function countPrice (currentId, priceId,  orientation) {var currentPrice = $("#"+currentId).attr("price");var changePrice = $("#"+priceId).attr("price");var finalPrice = 0;if (orientation) {finalPrice = parseInt(currentPrice) + parseInt(changePrice);} else {finalPrice = parseInt(currentPrice) - parseInt(changePrice);}$("#"+currentId).attr("price",finalPrice);return finalPrice/100;}//全选function checkedAll() {$("input[type='checkbox']").attr("checked",'checked');//全选}//全不选function notChecked() {$("input[type='checkbox']").removeAttr("checked");//取消全选}//结算，利用ajax表单异步提交function account() {$("#jvform").attr("action","${path}/or/shopCart/account").submit();}function getChecked() {var arr = new Array();$("input[type='checkbox']:checked").each(function(index, element){arr.push(element.value);});return arr;}</script></head><body><form id="jvform" method="post"><div>购物车页面</div><c:forEach items="${cartVO.shopCarts}" var="cart"><div ><input type="checkbox" id="checkbox${cart.id}" value="${cart.id}" name="ids" checked="checked" onchange="checkedOpt('${cart.id}')"/>名称：${cart.stockConf.goodsName }规格：<c:forEach items="${cart.stockConf.goodsSpecificationVals}" var="gsv">${gsv.name} : ${gsv.value}</c:forEach>购买数量：<a href="javascript:void(0);" onclick="delItem('${cart.id}')"> - </a> <input type="text" id="buyNum${cart.id}" value="${cart.buyNum}"/><a href="javascript:void(0);" onclick="addItem('${cart.id}', '${cart.stockConf.currStock}')"> + </a>单价：<div id="salePrice${cart.id}" price="${cart.stockConf.salePrice}" >${cart.stockConf.salePriceStr}</div>小计<div id="sumPrice${cart.id}" price="${cart.sumSalePrice}">${cart.sumSalePriceStr}</div><a href="javascript:void(0);" onclick="removeItem('${cart.id}')"> 删除 </a></div></c:forEach>选中数量：<div id="totalNum" >${cartVO.totalNum}</div>选中价格：<div id="totalPrice" price="${cartVO.totalPrice}">${cartVO.totalPriceStr}</div></form><a href="javascript:void(0);" onclick="account()">结算</a></body></html>
0 0