页面:
描述:一个简单的购物车程序,点击加入购物车链接后,相应的结果实时更新(商品名、总数量、总价格)
1、页面代码:
<html>
<head>
<script src="scripts/jquery-1.3.2.js"></script> //引入jquery,src为jquery在工程中的相对路径
</head>
<body>
商品 <span id="bookName"></span> 已加入购物车,购物车中共有书本 <span id="totalBook"></span> 本,总价格为 <span id="totalMoney"></span> 元<br><br>
Java<a href="addToCart?id=java&price=100">加入购物车</a>
<br><br>
Oracle<a href="addToCart?id=oracle&price=120">加入购物车</a> <!--href地址为servlet的URL地址-->
</body>
</html>
2、javaBean类(书本属性):ShoppingCartItem,书本的三个属性:number,bookName,price
package com.code;
public class ShoppingCartItem {
private int number=0;
private String bookName=null;
private int price=0;
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;
}
}
3、java类:ShoppingCart ,使用一个Map存放书本对象
import java.util.HashMap;
import java.util.Map;
import com.code.ShoppingCartItem;
public class ShoppingCart {
//存放书本信息的Map
private Map<String,ShoppingCartItem> items = new HashMap<String,ShoppingCartItem>();
public void addToCart(String bookName,int price){ //加入购物车(参数由servlet传递而来)
if(items.containsKey(bookName)){
ShoppingCartItem item = items.get(bookName);
item.setNumber(item.getNumber()+1);
}else{
ShoppingCartItem item = new ShoppingCartItem();
item.setBookName(bookName);
item.setNumber(1);
item.setPrice(price);
items.put(bookName, item);
}
}
public int getTotalNumber(){ //计算总数
int total=0;
for(ShoppingCartItem item:items.values()){
total+=item.getNumber();
}
return total;
}
public int getTotalMonry(){ //计算总价格
int money=0;
for(ShoppingCartItem item:items.values()){
money+=item.getNumber()*item.getPrice();
}
return money;
}
}
4、Servlet类:
package com.code;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
public class AddToCartServlet extends HttpServlet {
/**
* Constructor of the object.
*/
public AddToCartServlet() {
super();
}
/**
* Destruction of the servlet. <br>
*/
public void destroy() {
super.destroy(); // Just puts "destroy" string in log
// Put your code here
}
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request,response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//1,获取请求参数id,price;
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":.....}
StringBuilder result = new StringBuilder();
//拼装JSON数据,不能使单引号'
result.append("{").append("\"bookName\":\""+bookName+"\"").append(",").append("\"totalMoney\":"+sc.getTotalMonry()).append(",").append ("\"totalBook\":"+sc.getTotalNumber()).append("}");
//5、响应JSON
response.setContentType("text/javascript"); //声明类型
response.getWriter().print(result.toString());
}
public void init() throws ServletException {
// Put your code here
}
}
5、页面脚本:
<script>
$(function(){
$("a").click(function(){
var url = this.href;
var args = {"time":new Date()};
$.getJSON(url,args,function(data){
$("#bookName").text(data.bookName); //从返回数据中取相应值
$("#totalMoney").text(data.totalMoney);
$("#totalBook").text(data.totalBook);
});
return false;
});
})
</script>