<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>学考无忧-购物车</title> <link rel="stylesheet" href="__TMPL__/public/assets/css/reset.css" /> <link rel="stylesheet" href="__TMPL__/public/assets/css/base.css" /> </head> <body> <!-- 顶部 --> <div class="ad_top top_navBg"> <img class="ad_topImg" src="__TMPL__/public/assets/images/left2.png" alt="" /> <h1>购物车</h1> <p>管理</p> </div> <div class="shopping_cartBox"> <!-- 几件 --> <h2 class="sh_cartNum">共有{$num}件商品</h2> <ul class="order_newsUl sp_cartUl" style="margin-bottom:2.1rem"> <volist name="goods_data" id="vo"> <li> <div class="sh_cartround" data-id="{$vo.carid}"> <img src="__TMPL__/public/assets/images/39_0.png" alt="" /> </div> <div class="order_newsImg"> <img src="{:cmf_get_image_url($vo.thumbnail)}" alt="" /> </div> <div class="order_newsCon"> <div class="order_newsTxt1 txt-cut"> {$vo.book_name} </div> <div class="order_newsTxt2">×<span>{$vo.book_num}</span></div> <div class="order_newsTxt3"> <p class="de_topTxt1_1">¥<span>{$vo.price0}.{$vo.price1}</span></p> <div class="order_newsNum"> <div class="order_newsJian" onclick="jian({$vo.carid})">-</div> <input class="order_newsnum" type="text" readonly="readonly" value="{$vo.book_num}" /> <div class="order_newsJia" onclick="jia({$vo.carid})">+</div> </div> </div> </div> </li> </volist> </ul> </div> <!-- 支付 --> <div class="shop_carts"> <div class="shop_cartsBox"> <!-- 全选 --> <div class="shop_carts1"> <img src="__TMPL__/public/assets/images/39_1.png" alt="" /> <p>全选</p> </div> <!-- 合计 --> <div class="shop_carts2"> <span class="shop_cartsIco">合计:</span> <p class="de_topTxt1_1 zoji">¥<span id="myprice">0.00</span></p> </div> <!-- 去支付 --> <div class="shop_carts3" onclick="myjump()"> 去支付 </div> </div> </div> <!-- 删除 --> <div class="shop_remove"> <div class="shop_removeBox"> <!-- 全选 --> <div class="shop_carts1"> <img src="__TMPL__/public/assets/images/39_1.png" alt="" /> <p>全选</p> </div> <div class="shop_remove2" onclick="datadel()"> 删除 </div> </div> </div> <!-- 底部一级导航 --> <div class="in_bottom"> <ul> <a href="{:url('Index/index')}"> <li> <img src="__TMPL__/public/assets/images/22.png" alt="" /> <p>首页</p> </li> </a> <a href="{:url('Classify/classify')}"> <li> <img src="__TMPL__/public/assets/images/16.png" alt="" /> <p>分类</p> </li> </a> <li> <img src="__TMPL__/public/assets/images/20.png" alt="" /> <p style="color:#FF7700;">购物车</p> </li> <a href="{:url('Personalcenter/Personal_center')}"> <li> <img src="__TMPL__/public/assets/images/18.png" alt="" /> <p>我的</p> </li> </a> </ul> </div> <script src="__TMPL__/public/assets/js/base.js"></script> <script src="__TMPL__/public/assets/js/jquery.js"></script> <script> /** *删除 */ function datadel(){ ids = $('.add'); goods_id = []; for(i=0;i<ids.length;i++){ goods_id[i] = ids[i].dataset.id; } goods_id = goods_id.join(','); $.post("{:url('Shopcart/shop_cart_del')}",{goods_id:goods_id},function(data){ if(data){ }else{ alert('删除失败'); } }); } /** *点击跳转到订单页 */ function myjump(){ ids = $('.add'); goods_id = []; for(i=0;i<ids.length;i++){ goods_id[i] = ids[i].dataset.id; } console.log(goods_id); if(goods_id.length == 0){ alert('请选择商品'); }else{ $.post("{:url('Shopcart/is_to_pay')}",{},function(data){ if(data){ goods_id = goods_id.join(','); myprice = $('#myprice').text(); $.post("{:url('Shopcart/shop_cart_pay')}",{id:goods_id,myprice:myprice},function(data){ obj = JSON.parse(data); if(obj.type == 3){ alert('业务员商品和平台商品不能同时购买!'); }else if(obj.type == 1){ window.location.href = "{:url('Orderpage/order_page')}?indet_id="+obj.indet_id; }else if(obj.type == 2){ window.location.href = "{:url('Orderpage/order_salesman_ty')}?indet_id="+obj.indet_id; } }); }else{ alert('业务员不能购买书籍'); } }); } } /** *点击加一 */ function jia(id){ $.post("{:url('Shopcart/shop_cart_numadd')}",{id:id},function(data){ }); } /** * 点击减一 */ function jian(id){ $.post("{:url('Shopcart/shop_cart_numdec')}",{id:id},function(data){ }); } // 计算总计 function calcTotal() { var checkBoxes = $(".sh_cartround img"); var priceSpans = $(".order_newsTxt3 .de_topTxt1_1 span"); var countInputs = $(".order_newsNum .order_newsnum"); var totalCount = 0; var totalPrice = 0; for (var i = 0; i < priceSpans.length; i += 1) { // 强调: jQuery对象使用下标运算或get方法会还原成原生的JavaScript对象 if ($(checkBoxes[i]).attr("src") == "__TMPL__/public/assets/images/39.png") { var price = parseFloat($(priceSpans[i]).text()); var count = parseInt($(countInputs[i]).val()); totalCount += count; totalPrice += price * count; } } $(".zoji span").html(totalPrice.toFixed(2)); } function calcTotal2() { var checkBoxes = $(".sh_cartround img"); var priceSpans = $(".order_newsTxt3 .de_topTxt1_1 span"); var countInputs = $(".order_newsNum .order_newsnum"); var totalCount = 0; var totalPrice = 0; for (var i = 0; i < priceSpans.length; i += 1) { // 强调: jQuery对象使用下标运算或get方法会还原成原生的JavaScript对象 var price = parseFloat($(priceSpans[i]).text()); var count = parseInt($(countInputs[i]).val()); totalCount += count; totalPrice += price * count; } $(".zoji span").html(totalPrice.toFixed(2)); } $(function() { $(".order_newsNum div").on("click", function(evt) { if ($(this).text() == "-") { var count = parseInt($(this).next().val()); if (count > 1) { count -= 1; $(this).next().val(count); } else { alert("商品数量最少为1"); } $(this).parents(".order_newsCon").find(".order_newsTxt2 span").text(count); } else { var count = parseInt($(this).prev().val()); if (count < 200) { count += 1; $(this).prev().val(count); } else { alert("商品数量最多为200"); } $(this).parents(".order_newsCon").find(".order_newsTxt2 span").text(count); } var price = parseFloat($(this).parents(".order_newsTxt3").children(".de_topTxt1_1").text().split("¥")[1]); calcTotal(); }); // 单选 $('.order_newsUl li').each(function() { var length = $(".sh_cartround img").length; $(this).find('.sh_cartround img').click(function() { var flag = 1; for (var i = 0; i < $(".sh_cartround img").length; i++) { flag += Number($(".sh_cartround img").eq(i).attr('src') == "__TMPL__/public/assets/images/39.png"); } if (length === flag) { $(".shop_carts1 img").attr('src', "__TMPL__/public/assets/images/39.png"); } else { $(".shop_carts1 img").attr('src', "__TMPL__/public/assets/images/39_1.png"); } if ($(this).attr("src") == "__TMPL__/public/assets/images/39_0.png") { $(this).attr("src", "__TMPL__/public/assets/images/39.png"); calcTotal(); $(this).parents('.sh_cartround').addClass('add'); } else { $(this).attr("src", "__TMPL__/public/assets/images/39_0.png"); $(".shop_carts1 img").attr('src', "__TMPL__/public/assets/images/39_1.png"); calcTotal(); $(this).parents('.sh_cartround').removeClass('add'); } }); }); // 全选 $(".shop_carts1 img").click(function() { if ($(this).attr("src") == "__TMPL__/public/assets/images/39_1.png") { $(this).attr("src", "__TMPL__/public/assets/images/39.png"); $(".sh_cartround img").attr("src", "__TMPL__/public/assets/images/39.png"); $('.sh_cartround').addClass('add'); calcTotal2(); } else { $(this).attr("src", "__TMPL__/public/assets/images/39_1.png"); $(".sh_cartround img").attr("src", "__TMPL__/public/assets/images/39_0.png"); $('.sh_cartround').removeClass('add'); $(".zoji span").text("0"); } }); // 点击管理 $(".top_navBg p").click(function() { if ($(this).text() == "管理") { $(this).text("完成"); $(".shop_carts").hide(); $(".shop_remove").show(); } else { $(this).text("管理"); $(".shop_carts").show(); $(".shop_remove").hide(); } }); // 点击删除 $(".shop_remove2").click(function() { $($(".sh_cartround img")).each(function() { if ($(this).attr("src") == "__TMPL__/public/assets/images/39.png") { $(this) .parents("li") .remove(); } }); }); }); </script> </body> </html>