ajax（五） Ajax應用：加入購物車
阿新 • • 發佈：2019-01-28
ajax的加入購物車功能應用
頁面：index.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.js"></script> <script type="text/javascript"> $(function(){ var isHasCart = "${sessionScope.sc==null}"; if(isHasCart=="true"){ $("#cartstatus").hide(); }else{ $("#cartstatus").show(); $("#bookName").text("${sessionScope.sc.bookName}"); $("#totalBookNumber").text("${sessionScope.sc.totalBookNumber}"); $("#totalMoney").text("${sessionScope.sc.totalMoney}"); } $("a").click(function(){ $("#cartstatus").show(); var url = this.href; var args = {"time":new Date()}; $.getJSON(url,args,function(data){ $("#bookName").text(data.bookName); $("#totalBookNumber").text(data.totalBookNumber); $("#totalMoney").text(data.totalMoney); }); return false; }); }); </script> </head> <body> <div id="cartstatus"> 您已經將 <span id="bookName"></span> 加入到購物車中。 購物車中的書有 <span id="totalBookNumber"></span> 本。 總價格 <span id="totalMoney"></span> 元錢。 </div> Java <a href="${pageContext.request.contextPath }/addToCart?id=Java&price=100">加入購物車</a> <br><br> Oracle <a href="${pageContext.request.contextPath }/addToCart?id=Oracle&price=200">加入購物車</a> <br><br> Struts2 <a href="${pageContext.request.contextPath }/addToCart?id=Struts2&price=300">加入購物車</a> <br><br> </body> </html>
beans:ShoppingCart.java
package ajax.app.beans; import java.util.HashMap; import java.util.Map; public class ShoppingCart { private Map<String,ShoppingCartItem> items = new HashMap<String,ShoppingCartItem>(); private String bookName; public String getBookName() { return bookName; } public void addToCart(String bookName,int price){ this.bookName = bookName; if(items.containsKey(bookName)){ ShoppingCartItem item = items.get(bookName); item.setNumber(item.getNumber()+1); }else{ ShoppingCartItem item = new ShoppingCartItem(); item.setBookName(bookName); item.setPrice(price); item.setNumber(1); items.put(bookName, item); } } public int getTotalBookNumber(){ int total = 0; for(ShoppingCartItem item:items.values()){ total += item.getNumber(); } return total; } public int getTotalMoney(){ int money = 0; for(ShoppingCartItem item:items.values()){ money += item.getNumber()*item.getPrice(); } return money; } }
ShoppingCartItem
package ajax.app.beans; public class ShoppingCartItem { private int number; private String bookName; private int price; public int getNumber() { return number; } public void setNumber(int number) { this.number = number; } public String getBookName() { return bookName; } public void setBookName(String bookName) { this.bookName = bookName; } public int getPrice() { return price; } public void setPrice(int price) { this.price = price; } }
servlet:AddToCartServlet
package ajax.app.beans.servlets;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import ajax.app.beans.ShoppingCart;
@WebServlet("/addToCart")
public class AddToCartServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String bookName = request.getParameter("id");
int price = Integer.parseInt(request.getParameter("price"));
HttpSession session = request.getSession();
ShoppingCart sc = (ShoppingCart) session.getAttribute("sc");
if(sc==null){
sc = new ShoppingCart();
session.setAttribute("sc", sc);
}
sc.addToCart(bookName, price);
StringBuilder result = new StringBuilder();
//響應的JSON物件：{"bookName":"Java","totalBookNumber":10,"totalMoney":2000}
result.append("{")
.append("\"bookName\":\""+bookName+"\"")
.append(",")
.append("\"totalBookNumber\":"+sc.getTotalBookNumber())
.append(",")
.append("\"totalMoney\":"+sc.getTotalMoney())
.append("}");
response.setContentType("text/javascript");
response.getWriter().print(result);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
效果圖
