您的位置：首页 > 其它

Ajax+Servlet 实现购物车功能

2018-02-16 14:13 417 查看

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>

<!--
1. 获取当前页面所有的 a 节点，并为每一个 a 节点添加 onclick 响应函数，同时取消默认行为
2. 准备发送 Ajax 请求：url(a 节点的 href 属性值)；args（时间戳）
3. 响应为一个 json 对象，包括：bookName，totalBookNumber，totalMoney
4. 把对应的属性添加到对应的位置
-->
<script type="text/javascript" src = "${pageContext.request.contextPath}/scipts/jquery-2.1.0.js"></script>
<script type="text/javascript">
$(function(){
$("a").click(function(){
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>

您已经将  <span id = "bookName"></span>  加入到购物车中。<br/>
购物车中的书有   <span id = "totalBookNumber"></span>  本 <br/>
总价格 <span id ="totalMoney"></span>  钱
<br/><br/><br/><br/>

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=100">加入购物车</a>
<br/><br/>
</body>
</html>

ShoppingCart购物车实体类

public class ShoppingCart {

//存放 ShoppingCartItem 的 Map : 键-> 书名， 值 -> ShoppingCartItem 对象
private Map<String,ShoppingCartItem> items = new HashMap<String,ShoppingCartItem>();

public void addToCart(String bookName,int price){
if(items.containsKey(bookName)) {
ShoppingCartItem item = items.get(bookName);
item.setNum(item.getNum()+1);
}else {
ShoppingCartItem item = new ShoppingCartItem();
item.setBookName(bookName);
item.setPrice(price);
item.setNum(1);

items.put(bookName, item);
}
}

public int getTotalBookNumber() {
int total = 0;

for(ShoppingCartItem item: items.values())
total += item.getNum();
return total;
}

public int getTotalMoney() {
int money = 0;

for(ShoppingCartItem item: items.values())
money += item.getNum() * item.getPrice();
return money;
}
}

ShoppingCartItem购物车物品类

public class ShoppingCartItem {

private int num;

private String bookName;

private int price;

public int getNum() {
return num;
}

public void setNum(int num) {
this.num = num;
}

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代码

@WebServlet("/addToCart")
public class AddToCartServlet extends HttpServlet {
private static final long serialVersionUID = 1L;

public AddToCartServlet() {
super();
}

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request,response);
}

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//1. 获取请求参数：id，prince
String bookName = request.getParameter("id");
int price =Integer.parseInt(request.getParameter("price"));
//2. 获取购物车对象
HttpSession session = request.getSession();
ShoppingCart sc = (ShoppingCart) session.getAttribute("sc");

if(sc == null) {
sc = new ShoppingCart();
session.setAttribute("sc", sc);
}

//3. 把点击的选项加入到购物车
sc.addToCart(bookName, price);

//4. 准备响应的 JSON 对象：{"bookName":"","totalBookNumber":1,"totalMoney":1}
// 若从服务端返回 json 字符串，属性名必须是双引号
/*      StringBuilder result = new StringBuilder();
result.append("{")
.append("\"bookName\":\""+bookName+"\"")
.append(",")
.append("\"totalBookNumber\":"+sc.getTotalBookNumber())
.append(",")
.append("\"totalMoney\":"+sc.getTotalMoney())
.append("}");*/
ObjectMapper objectMapper = new ObjectMapper();
String jsonStr = objectMapper.writeValueAsString(sc);

//5. 响应 JSON 对象
response.setCharacterEncoding("UTF-8");
response.setContentType("text/javascript");
/*response.getWriter().print(result.toString());*/
response.getWriter().print(jsonStr);
}

}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航