一、网页效果
1、登录(vip用户和普通会员)
选择vip和普通会员，最终的付款折扣会不同。
2、购物页面
文本框中输入要购买的数量
3、结账页面（购物操作的数量以1、2、3为例）
名字前面显示vip或者普通会员，后面显示名字。
商品后面显示购买的物品以及数量。
应付款以及打折后的金额。
二、下面是代码的制作过程：
1、登录页面：主要架构为一个表单。（需要一个javabean附在之后）
创建一个jsp文件，取名为denglu.jsp。
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@page import="mybean.Buy" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>登录页面</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<body>
<h2>欢迎来到购物网站</h2>
请输入你的信息：<br>
<form action="buy.jsp" method="post">
<input type="text" name="username" value="Guest" /><br>
<input type="radio" name="vip" value="y" checked>vip会员
<input type="radio" name="vip" value="n">普通会员 <br>
<input type="submit" value="开始购物"/>
</form>
</body>
</html>
创建一个名为mybean的Java包，在其目录下创建Buy.java.
package mybean;
import java.io.Serializable;
public class Buy implements Serializable {
private String username;
private String vip;
private int Clothes=0;
private int Pants=0;
private int Shoes=0;
private String notice;
private int sum;
public Buy() {
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getVip() {
return vip;
}
public void setVip(String vip) {
this.vip = vip;
}
public int getClothes() {
return Clothes;
}
public void setClothes(int Clothes) {
this.Clothes = Clothes;
}
public int getPants() {
return Pants;
}
public void setPants(int Pants) {
this.Pants = Pants;
}
public int getShoes() {
return Shoes;
}
public void setShoes(int Shoes) {
this.Shoes = Shoes;
}
public String getNotice() {
return notice;
}
public void setNotice(String notice) {
this.notice = notice;
}
public int getSum() {
return sum;
}
public void setSum(int sum) {
this.sum = sum;
}
public String PrintVip(){
if(vip.equals("y")) return "VIP";
else return "普通会员";
}
public String Cart(){
notice="";
notice+=getClothes()+"件衣服 ";
notice+=getPants()+"件裤子 ";
notice+=getShoes()+"双鞋 ";
return notice;
}
public int Sum(){
sum=0;
sum+=getClothes()*120;
sum+=getPants()*100;
sum+=getShoes()*80;
return sum;
}
public String Notice(){
if(vip.equals("y")) return "享有八折优惠";
else return "不享有优惠";
}
public double Discount(){
if(vip.equals("y")) return sum*(0.8);
else return sum;
}
}
2、购买页面。
创建一个buy.jsp.
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'buy.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<body>
<h2>购物——商品选择页面</h2>
<jsp:useBean id="buy" class="mybean.Buy" scope="session" />
<jsp:setProperty name="buy" property="*" />
<%buy.setUsername(new String (buy.getUsername())); %>
欢迎<%=buy.getUsername() %>：<%=buy.PrintVip() %>来到百货商店！<br>
请选择要购买的商品：<br>
<form action="pay.jsp" method="post">
<input type="text" name="Clothes" style="width:40px;">衣服 120元
<input type="text" name="Pants" style="width:40px;">裤子 100元
<input type="text" name="Shoes" style="width:40px;">鞋 80元<br>
<input type="submit" value="提交"/>
</form>
</body>
</html>
3、结算页面。
创建一个pay.jsp.
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'pay.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<body>
<h2>购物——结账页面</h2>
<jsp:useBean id="buy" class="mybean.Buy" scope="session" />
<jsp:setProperty name="buy" property="*" />
<%
String Clothes;
Clothes=request.getParameter("Clothes");
int A = Integer.parseInt(Clothes);
buy.setClothes(A);
Clothes=request.getParameter("Pants");
int B = Integer.parseInt(Clothes);
buy.setPants(B);
Clothes=request.getParameter("Shoes");
int C = Integer.parseInt(Clothes);
buy.setShoes(C);
%>
<%=buy.PrintVip() %>的姓名是：<%=buy.getUsername() %><br>
要购买的商品是：<%=buy.Cart()%><br>
应付款是：<%=buy.Sum() %>元，您<%=buy.Notice()%>，实付款是：<%=buy.Discount() %>元<br>
欢迎您下次光临！
</body>
</html>
更多推荐
一个简单购物网页的制作过程
发布评论