(十八)移除购物车中的商品
案例2-对购物车进行操作(删除) 步骤分析: 1.在购物车页面上,点击删除 /store/cart?method=remove&pid=?? 2.在cartServlet中编写remove 先获取商品的pid 获取购物车 删除购物车项 3.重定向到/jsp/cart.jsp
/store/WebContent/jsp/cart.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <!doctype html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>会员登录</title> <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css" type="text/css" /> <script src="${pageContext.request.contextPath}/js/jquery-1.11.3.min.js" type="text/javascript"></script> <script src="${pageContext.request.contextPath}/js/bootstrap.min.js" type="text/javascript"></script> <!-- 引入自定义css文件 style.css --> <link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css" type="text/css" /> <style> body { margin-top: 20px; margin: 0 auto; } .carousel-inner .item img { width: 100%; height: 300px; } .container .row div { /* position:relative; float:left; */ } font { color: #3164af; font-size: 18px; font-weight: normal; padding: 0 10px; } </style> </head> <body> <!-- 动态包含 --> <jsp:include page="/jsp/head.jsp"></jsp:include> <div class="container"> <c:if test="${empty cart.map }"> <h1>购物车空空如也~~赶紧逛逛去!!</h1> </c:if> <c:if test="${not empty cart.map }"> <div class="row"> <div style="margin:0 auto; margin-top:10px;width:950px;"> <strong style="font-size:16px;margin:5px 0;">订单详情</strong> <table class="table table-bordered"> <tbody> <tr class="warning"> <th>图片</th> <th>商品</th> <th>价格</th> <th>数量</th> <th>小计</th> <th>操作</th> </tr> <c:forEach items="${cart.itmes }" var="item"> <tr class="active"> <td width="60" width="40%"> <input type="hidden" name="id" value="22"> <img src="${pageContext.request.contextPath}/${item.product.pimage}" width="70" height="60"> </td> <td width="30%"> <a target="_blank">${item.product.pname }</a> </td> <td width="20%"> ¥${item.product.shop_price } </td> <td width="10%"> <input type="text" name="quantity" value="${item.count }" maxlength="4" size="10" readonly="readonly"> </td> <td width="15%"> <span class="subtotal">¥${item.subtotal }</span> </td> <td>
<!--删除的时候判断一下--> <a href="javascript:void(0);" class="delete" οnclick="removeFromCart('${item.product.pid}')">删除</a> </td> </tr> </c:forEach> </tbody> </table> </div> </div> <div style="margin-right:130px;"> <div style="text-align:right;"> <em style="color:#ff6600;"> 登录后确认是否享有优惠 </em> 赠送积分: <em style="color:#ff6600;">596</em> 商品金额: <strong style="color:#ff6600;">¥${cart.total }元</strong> </div> <div style="text-align:right;margin-top:10px;margin-bottom:10px;"> <a href="${pageContext.request.contextPath }/cart?method=clear" id="clear" class="clear">清空购物车</a> <a href="${pageContext.request.contextPath }/order?method=add"> <input type="submit" width="100" value="提交订单" name="submit" border="0" style="background: url('${pageContext.request.contextPath}/images/register.gif') no-repeat scroll 0 0 rgba(0, 0, 0, 0); height:35px;width:100px;color:white;"> </a> </div> </div> </c:if> </div> <div style="margin-top:50px;"> <img src="${pageContext.request.contextPath}/image/footer.jpg" width="100%" height="78" alt="我们的优势" title="我们的优势" /> </div> <div style="text-align: center;margin-top: 5px;"> <ul class="list-inline"> <li><a>关于我们</a></li> <li><a>联系我们</a></li> <li><a>招贤纳士</a></li> <li><a>法律声明</a></li> <li><a>友情链接</a></li> <li><a target="_blank">支付方式</a></li> <li><a target="_blank">配送方式</a></li> <li><a>服务声明</a></li> <li><a>广告声明</a></li> </ul> </div> <div style="text-align: center;margin-top: 5px;margin-bottom:20px;"> Copyright © 2005-2016 传智商城 版权所有 </div> </body> <script type="text/javascript"> function removeFromCart(pid){ if(confirm("您确认狠心要丢弃我吗?")){ location.href="${pageContext.request.contextPath}/cart?method=remove&pid="+pid; } } </script> </html>
com.louis.web.servlet.CartServlet
/* * 从购物车中删除购物项 * */ public String remove(HttpServletRequest request, HttpServletResponse response) throws Exception{ //1、获取商品的pid String pid = request.getParameter("pid"); //2、调用购物车的remove方法 getCart(request).removeFromCart(pid); //3、重定向 response.sendRedirect(request.getContextPath()+"/jsp/cart.jsp"); return null; }
问题
1、javascript:void(0)
2、confirm("您确认狠心要丢弃我吗?")
3、location.href
posted on 2017-10-14 19:01 Michael2397 阅读(...) 评论(...) 编辑 收藏