作者 anyv
1 个管道 的构建 通过 耗费 0 秒

购物车

<?php
// +----------------------------------------------------------------------
// | bronet [ 以客户为中心 以奋斗者为本 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2013-2017 http://www.bronet.cn All rights reserved.
// +----------------------------------------------------------------------
// | Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
// +----------------------------------------------------------------------
namespace app\portal\controller;
use cmf\controller\WeChatBaseController;
use think\Db;
class ShopcartController extends WeChatBaseController{
/**
* 显示购物车页
*/
public function shop_cart(){
return $this -> fetch();
}
}
\ No newline at end of file
... ...
<!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">共有3件商品</h2>
<ul class="order_newsUl sp_cartUl" style="margin-bottom:2.1rem">
<li>
<div class="sh_cartround">
<img src="__TMPL__/public/assets/images/39_0.png" alt="" />
</div>
<div class="order_newsImg">
<img src="__TMPL__/public/assets/images/36.png" alt="" />
</div>
<div class="order_newsCon">
<div class="order_newsTxt1 txt-cut">
小学五年级英语下册语五年级下册好用不贵经济实惠五年级下册好...
</div>
<div class="order_newsTxt2">×<span>1</span></div>
<div class="order_newsTxt3">
<p class="de_topTxt1_1"><span>265</span>.00</p>
<div class="order_newsNum">
<div class="order_newsJian">-</div>
<input class="order_newsnum" type="text" readonly="readonly" value="1" />
<div class="order_newsJia">+</div>
</div>
</div>
</div>
</li>
<li>
<div class="sh_cartround">
<img src="__TMPL__/public/assets/images/39_0.png" alt="" />
</div>
<div class="order_newsImg">
<img src="__TMPL__/public/assets/images/36.png" alt="" />
</div>
<div class="order_newsCon">
<div class="order_newsTxt1 txt-cut">
小学五年级英语下册语五年级下册好用不贵经济实惠五年级下册好...
</div>
<div class="order_newsTxt2">×<span>1</span></div>
<div class="order_newsTxt3">
<p class="de_topTxt1_1"><span>265</span>.00</p>
<div class="order_newsNum">
<div class="order_newsJian">-</div>
<input class="order_newsnum" type="text" readonly="readonly" value="1" />
<div class="order_newsJia">+</div>
</div>
</div>
</div>
</li>
</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>265.00</span></p>
</div>
<!-- 去支付 -->
<div class="shop_carts3">
<a href="w_Ypayment.html" style="color:white;">
去支付
</a>
</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">
删除
</div>
</div>
</div>
<!-- 底部一级导航 -->
<div class="in_bottom">
<ul>
<a href="index.html">
<li>
<img src="__TMPL__/public/assets/images/22.png" alt="" />
<p>首页</p>
</li>
</a>
<a href="nav_class.html">
<li>
<img src="__TMPL__/public/assets/images/16.png" alt="" />
<p>分类</p>
</li>
</a>
<a href="w_shopping_cart.html">
<li>
<img src="__TMPL__/public/assets/images/20.png" alt="" />
<p style="color:#FF7700;">购物车</p>
</li>
</a>
<a href="log_one.html">
<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() {
$(".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]);
calcTotal2();
});
// 单选
$(".sh_cartround img").each(function() {
$(this).on("click", function() {
if ($(this).attr("src") == "__TMPL__/public/assets/images/39_0.png") {
$(this).attr("src", "__TMPL__/public/assets/images/39.png");
calcTotal();
} else {
$(this).attr("src", "__TMPL__/public/assets/images/39_0.png");
calcTotal();
}
});
});
// 全选
$(".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");
calcTotal();
} else {
$(this).attr("src", "__TMPL__/public/assets/images/39_1.png");
$(".sh_cartround img").attr("src", "__TMPL__/public/assets/images/39_0.png");
$(".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();
}
});
});
// 计算总计
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") == "img/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));
}
});
</script>
</body>
</html>
\ No newline at end of file
... ...