Ajax 简单购物车工程

2024-09-01 14:48
文章标签 简单 工程 ajax 购物车

本文主要是介绍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 }/scripts/jquery.js">
</script><script type="text/javascript">$(function(){var isHasCart = "${sessionScope.sc==null}";if(isHasCart){$("#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> 元<br></div>Java     <a href="${pageContext.request.contextPath }/addToCart?id=Java&price=100">加入购物车</a><br>Oracle   <a href="${pageContext.request.contextPath }/addToCart?id=Oracle&price=200">加入购物车</a><br>Struts2  <a href="${pageContext.request.contextPath }/addToCart?id=Struts2&price=100">加入购物车</a><br></body>
</html>
AddToCart.java

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 com.trekiz.beans.ShoppingCart;/*** Servlet implementation class AddToCart*/
@WebServlet("/addToCart")
public class AddToCart extends HttpServlet {private static final long serialVersionUID = 1L;/*** @see HttpServlet#HttpServlet()*/public AddToCart() {super();// TODO Auto-generated constructor stub}/*** @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)*/protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doPost(request,response);}/*** @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)*/protected void doPost(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);//准备响应的json对象StringBuilder result = new StringBuilder();//若从服务端返回json字符串,则属性名必须使用双引号result.append("{").append("\"bookName\":\""+bookName+"\"").append(",").append("\"totalBookNumber\":"+sc.getTotalBookNumber()).append(",").append("\"totalMoney\":"+sc.getTotalMoney()).append("}");response.setContentType("text/javascript");response.getWriter().println(result.toString());}}

ShoppingCart.java

import java.util.HashMap;
import java.util.Map;public class ShoppingCart {private String bookName;private Map<String,ShoppingCartItem> items = new HashMap<String, ShoppingCartItem>();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 = total + item.getNumber();}return total;}public int getTotalMoney(){int money = 0;for(ShoppingCartItem item : items.values()){money = money + item.getPrice()*item.getNumber();}return money;}public String getBookName(){return this.bookName;}}
ShoppingCartItem.java


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;}}

拼接json字符串时,在导入jackson jar后,可以使用如下两行代码,更简便

ObjectMapper mapper = new ObjectMapper();
String result = mapper.writeValueAsString(sc);

效果图:




这篇关于Ajax 简单购物车工程的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1127244

相关文章

HTML5实现的移动端购物车自动结算功能示例代码

《HTML5实现的移动端购物车自动结算功能示例代码》本文介绍HTML5实现移动端购物车自动结算,通过WebStorage、事件监听、DOM操作等技术,确保实时更新与数据同步,优化性能及无障碍性,提升用... 目录1. 移动端购物车自动结算概述2. 数据存储与状态保存机制2.1 浏览器端的数据存储方式2.1.

基于Python实现一个简单的题库与在线考试系统

《基于Python实现一个简单的题库与在线考试系统》在当今信息化教育时代,在线学习与考试系统已成为教育技术领域的重要组成部分,本文就来介绍一下如何使用Python和PyQt5框架开发一个名为白泽题库系... 目录概述功能特点界面展示系统架构设计类结构图Excel题库填写格式模板题库题目填写格式表核心数据结构

C/C++ chrono简单使用场景示例详解

《C/C++chrono简单使用场景示例详解》:本文主要介绍C/C++chrono简单使用场景示例详解,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友... 目录chrono使用场景举例1 输出格式化字符串chrono使用场景China编程举例1 输出格式化字符串示

windows和Linux安装Jmeter与简单使用方式

《windows和Linux安装Jmeter与简单使用方式》:本文主要介绍windows和Linux安装Jmeter与简单使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地... 目录Windows和linux安装Jmeter与简单使用一、下载安装包二、JDK安装1.windows设

MyBatisX逆向工程的实现示例

《MyBatisX逆向工程的实现示例》本文主要介绍了MyBatisX逆向工程的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学... 目录逆向工程准备好数据库、表安装MyBATisX插件项目连接数据库引入依赖pom.XML生成实体类、

SpringMVC 通过ajax 前后端数据交互的实现方法

《SpringMVC通过ajax前后端数据交互的实现方法》:本文主要介绍SpringMVC通过ajax前后端数据交互的实现方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价... 在前端的开发过程中,经常在html页面通过AJAX进行前后端数据的交互,SpringMVC的controll

AJAX请求上传下载进度监控实现方式

《AJAX请求上传下载进度监控实现方式》在日常Web开发中,AJAX(AsynchronousJavaScriptandXML)被广泛用于异步请求数据,而无需刷新整个页面,:本文主要介绍AJAX请... 目录1. 前言2. 基于XMLHttpRequest的进度监控2.1 基础版文件上传监控2.2 增强版多

使用Python开发一个简单的本地图片服务器

《使用Python开发一个简单的本地图片服务器》本文介绍了如何结合wxPython构建的图形用户界面GUI和Python内建的Web服务器功能,在本地网络中搭建一个私人的,即开即用的网页相册,文中的示... 目录项目目标核心技术栈代码深度解析完整代码工作流程主要功能与优势潜在改进与思考运行结果总结你是否曾经

Mysql表的简单操作(基本技能)

《Mysql表的简单操作(基本技能)》在数据库中,表的操作主要包括表的创建、查看、修改、删除等,了解如何操作这些表是数据库管理和开发的基本技能,本文给大家介绍Mysql表的简单操作,感兴趣的朋友一起看... 目录3.1 创建表 3.2 查看表结构3.3 修改表3.4 实践案例:修改表在数据库中,表的操作主要

springboot简单集成Security配置的教程

《springboot简单集成Security配置的教程》:本文主要介绍springboot简单集成Security配置的教程,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,... 目录集成Security安全框架引入依赖编写配置类WebSecurityConfig(自定义资源权限规则