rotuer.js router.get(’/changeOneCart’, initMiddleware, controller.default.cart.changeOneCart); router.get(’/changeAllCart’, initMiddleware, controller.default.cart.changeAllCart);controllerapp/controller/default/cart.js单个check async changeOneCart() { var goods_id = this.ctx.request.query.goods_id; var color = this.ctx.request.query.color; var goodsResult = await this.ctx.model.Goods.find({ “_id”: goods_id }); if (!goodsResult || goodsResult.length == 0) { this.ctx.body = { “success”: false, msg: ‘改变状态失败’ } } else { var cartList = this.service.cookies.get(‘cartList’); var allPrice = 0; //总价格 for (var i = 0; i < cartList.length; i++) { if (cartList[i]._id == goods_id && cartList[i].color == color) { cartList[i].checked = !cartList[i].checked; } //计算总价 if (cartList[i].checked) { allPrice += cartList[i].price * cartList[i].num; } } this.service.cookies.set(‘cartList’, cartList); this.ctx.body = { “success”: true, allPrice: allPrice } } }全选 async changeAllCart() { var type = this.ctx.request.query.type; var cartList = this.service.cookies.get(‘cartList’); var allPrice = 0; //总价格 for (var i = 0; i < cartList.length; i++) { if (type == 1) { cartList[i].checked = true; } else { cartList[i].checked = false; } //计算总价 if (cartList[i].checked) { allPrice += cartList[i].price * cartList[i].num; } } this.service.cookies.set(‘cartList’, cartList); this.ctx.body = { “success”: true, allPrice: allPrice } }viewapp/view/default/cart.html<% include ./public/header.html%> <!–end header –> <link rel=“stylesheet” href="/public/default/css/cart.css" /> <script src="/public/default/js/cart.js"> </script> <!– start banner_x –> <div class=“banner_x center”> <a href="./index.html" target="_blank"> <div class=“logo fl”></div> </a> <div class=“wdgwc fl ml40”>我的购物车</div> <div class=“wxts fl ml20”>温馨提示：产品是否购买成功，以最终下单为准哦，请尽快结算</div> <div class=“dlzc fr”> <ul> <li><a href="./login.html" target="_blank">登录</a></li> <li>|</li> <li><a href="./register.html" target="_blank">注册</a></li> </ul> </div> <div class=“clear”></div> </div> <div class=“xiantiao”></div> <div class=“gwcxqbj”> <div class=“gwcxd center”> <table class=“table”> <tr class=“th”> <th> <input type=“checkbox” id=“checkAll” /> 全选 </th> <th> 商品名称 </th> <th>单价</th> <th>数量</th> <th>小计</th> <th>操作</th> </tr> <%for(var i=0;i<cartList.length;i++){%> <tr class=“cart_list”> <td> <input type=“checkbox” goods_id="<%=cartList[i]._id%>" color="<%=cartList[i].color%>" <%if(cartList[i].checked){%>checked <%}%> /> </td> <td> <div class=“col_pic”> <img src="<%=cartList[i].goods_img%>" /> </div> <div class=“col_title”> <%=cartList[i].title%> </div> </td> <td class=“price”> <%=cartList[i].price%>元 </td> <td> <div class=“cart_number”> <div class=“input_left decCart” goods_id="<%=cartList[i]._id%>" color="<%=cartList[i].color%>">-</div> <div class=“input_center”> <input id=“num” name=“num” readonly=“readonly” type=“text” value="<%=cartList[i].num%>" /> </div> <div class=“input_right incCart” goods_id="<%=cartList[i]._id%>" color="<%=cartList[i].color%>">+</div> </div> </td> <td class=“totalPrice”> <%=parseFloat(cartList[i].price)*cartList[i].num%>元 </td> <td> <span><a class=“delete” href="/removeCart?goods_id=<%=cartList[i]._id%>&color=<%=cartList[i].color%>"> 删除</a></span> </td> </tr> <%}%> </table> </div> <div class=“jiesuandan mt20 center”> <div class=“tishi fl ml20”> <ul> <li><a href="./liebiao.html">继续购物</a></li> <li>|</li> <li>共<span>2</span>件商品，已选择<span>1</span>件</li> <div class=“clear”></div> </ul> </div> <div class=“jiesuan fr”> <div class=“jiesuanjiage fl”>合计（不含运费）：<span id=“allPrice”><%=allPrice%>元</span></div> <div class=“jsanniu fr”><input class=“jsan” type=“submit” name=“jiesuan” value=“去结算” /></div> <div class=“clear”></div> </div> <div class=“clear”></div> </div> </div> <!– footer –> <footer class=“center”> <div class=“mt20”>小米商城|MIUI|米聊|多看书城|小米路由器|视频电话|小米天猫店|小米淘宝直营店|小米网盟|小米移动|隐私政策|Select Region</div> <div>©mi.com 京ICP证110507号 京ICP备10046444号 京公网安备11010802020134号 京网文[2014]0059-0009号</div> <div>违法和不良信息举报电话：185-0130-1238，本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</div> </footer> </body> </html>前端jsapp/public/default/js/cart.js(function($) { var app = { init: function() { this.initCheckBox(); this.changeCartNum(); this.isCheckedAll(); this.deleteConfirm(); }, deleteConfirm: function() { $(’.delete’).click(function() { var flag = confirm(‘您确定要删除吗?’); return flag; }) }, initCheckBox() { $("#checkAll").click(function() { if (this.checked) { $(":checkbox").prop(“checked”, true); $.get(’/changeAllCart?type=1’, function(response) { if (response.success) { $("#allPrice").html(response.allPrice + ‘元’); } }); } else { $(":checkbox").prop(“checked”, false); $.get(’/changeAllCart?type=0’, function(response) { if (response.success) { $("#allPrice").html(response.allPrice + ‘元’); } }); } }); var _that = this; $(".cart_list input:checkbox").click(function() { _that.isCheckedAll(); var goods_id = $(this).attr(‘goods_id’); var color = $(this).attr(‘color’); $.get(’/changeOneCart?goods_id=’ + goods_id + ‘&color=’ + color, function(response) { if (response.success) { $("#allPrice").html(response.allPrice + ‘元’); } }); }); }, //判断全选是否选择 isCheckedAll() { var chknum = $(".cart_list input:checkbox").size(); //checkbox总个数 var chk = 0; //checkbox checked=true总个数 $(".cart_list input:checkbox").each(function() { if ($(this).prop(“checked”) == true) { chk++; } }); if (chknum == chk) { //全选 $("#checkAll").prop(“checked”, true); } else { //不全选 $("#checkAll").prop(“checked”, false); } }, changeCartNum() { $(’.decCart’).click(function() { var goods_id = $(this).attr(‘goods_id’); var color = $(this).attr(‘color’); // alert(color); $.get(’/decCart?goods_id=’ + goods_id + ‘&color=’ + color, function(response) { if (response.success) { $("#allPrice").html(response.allPrice + ‘元’); $(this).siblings(’.input_center’).find(‘input’).val(response.num); var price = parseFloat($(this).parent().parent().siblings(’.price’).html()); $(this).parent().parent().siblings(’.totalPrice’).html(response.num * price + “元”); } }.bind(this)); //注意this指向 }) $(’.incCart’).click(function() { var goods_id = $(this).attr(‘goods_id’); var color = $(this).attr(‘color’); $.get(’/incCart?goods_id=’ + goods_id + ‘&color=’ + color, function(response) { if (response.success) { $("#allPrice").html(response.allPrice + ‘元’); $(this).siblings(’.input_center’).find(‘input’).val(response.num); var price = parseFloat($(this).parent().parent().siblings(’.price’).html()); $(this).parent().parent().siblings(’.totalPrice’).html(response.num * price + ‘元’); } }.bind(this)); }) } } $(function() { app.init(); })})($)效果