基于Servlet&Jsp的网上书店设计(三)

时间  2020-12-31
栏目 JSP 繁體版
原文   原文链接

六，本设计Servlet&Jsp代码实现过程

用一句话概括，用户在客户端请求jsp页面，jsp页面将结果提交到Servlet，由Servlet负责处理结果，访问数据库等操作，并将参数结果放在request，session，application等元素中，然后通过请求转发和重定向转发到其他jsp页面或者Servlet

6.1进入主页和查看书籍详细信息功能

客户通过客户端请求地址http://localhost:8080/ShoppingCart/frame.jsp，请求主页面，主页面采用框架标签frameset，框架中页面再转发请求Http://localhost:8080/ShoppingCart/PageQueryServlet，  返回的books.jsp页面

frame.Jsp的代码

[html]  view plain  copy
 print ?
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2.   
  3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  4. <html>  
  5.   <head>  
  6.     <title>喵喵网上书店</title>     
  7.   </head>    
  8.    
  9.    <frameset cols="25%,75%" frameborder="NO" border="0" framespacing="0">  
  10.        <frame src="login.jsp" noresize scrolling="no" name="leftframe">       
  11.        <frame src="Http://localhost:8080/ShoppingCart/PageQueryServlet" name="rightframe" noresize scrolling="yes">       
  12.    </frameset>  
  13. </html>  

PageQueryServlet.Java的Servlet是分页显示书籍的代码

[java]  view plain  copy
 print ?
  1. package com.servlets;  
  2.   
  3. import java.io.IOException;  
  4. import java.io.PrintWriter;  
  5. import java.util.List;  
  6.   
  7. import javax.servlet.ServletException;  
  8. import javax.servlet.http.HttpServlet;  
  9. import javax.servlet.http.HttpServletRequest;  
  10. import javax.servlet.http.HttpServletResponse;  
  11. import com.Dao.PageQueryDao;  
  12. import com.beans.Book;  
  13.   
  14. public class PageQueryServlet extends HttpServlet {  
  15.   
  16.     public void doGet(HttpServletRequest request, HttpServletResponse response)  
  17.             throws ServletException, IOException {  
  18.           int currpage=1;  
  19.           if(request.getParameter("page")!=null){  
  20.               currpage=Integer.parseInt(request.getParameter("page"));  
  21.           }  
  22.           
  23.          PageQueryDao pagedao=new PageQueryDao();  
  24.          List<Book> list=pagedao.getPageList(currpage);//查询当前页记录  
  25.          request.setAttribute("list", list);   
  26.          int pages;   //计算查询总页数  
  27.          int count=pagedao.FindCounts();  
  28.          if(count%Book.PAGE_SIZE==0){  
  29.              pages=count/Book.PAGE_SIZE;  
  30.          }  
  31.          else{  
  32.              pages=count/Book.PAGE_SIZE+1;  
  33.          }  
  34.            
  35.          StringBuffer sb=new StringBuffer();  
  36.          //构建分页条  
  37.          for(int i=1;i<=pages;i++){  
  38.              if(i==currpage){  
  39.                  sb.append("『" + i + "』");  
  40.              }  
  41.              else{  
  42.                  sb.append("<a href='PageQueryServlet?page="+i+"'>"+i+"</a>");  
  43.              }  
  44.              sb.append(" ");  
  45.          }  
  46.          request.setAttribute("bar", sb.toString());  
  47.          request.getRequestDispatcher("books.jsp").forward(request, response);  //请求转发    
  48.     }  
  49.     protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
  50.         doGet(request, response);  
  51.     }  
  52.   
  53. }  

Books.jsp是显示书籍

[html]  view plain  copy
 print ?
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <%@page import="java.util.List"%>  
  3. <%@page import="com.beans.Book"%><html>  
  4. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  5. <html>  
  6.   <head>  
  7.     <title>图书信息列表</title>  
  8.   
  9.     <!-- 
  10.     <link rel="stylesheet" type="text/css" href="styles.css"> 
  11.     -->  
  12.     <style type="text/css">  
  13.         a:link{color:#FF4500;text-decoration:none}/*未访问，红色，无下划线*/  
  14.         a:active{color:blue;}/*激活，红色*/  
  15.         a:visited{color:red;text-decoration:none}/*已访问，紫色，无下划线*/  
  16.         a:hover{color:yellow;text-decoration:underline}/*鼠标移动上面，蓝色，下划线*/  
  17.     </style>  
  18.   </head>  
  19.     
  20.   <body bgcolor="#98FB98" >  
  21.         <br><br>  
  22.        <table align="center" width="900">  
  23.           <tr>  
  24.              <td align="center" colspan="6" valign="baseline">  
  25.                  <h2 style=" font-family:隶书;color:#0A0A0A;font-size:50px">喵喵网上书店</h2>  
  26.              </td>  
  27.           </tr>  
  28.             <%! int i=1,j=1; %>  
  29.            <% List<Book> list=(List<Book>)request.getAttribute("list");%>  
  30.            <% for(j=1;j<=2;j++){ %>  
  31.              <tr >  
  32.             <%   
  33.                for(Book b:list){   
  34.                    if(j==2){  
  35.                      if(b.getBookId()<=3||(b.getBookId()>=7&&b.getBookId()<=9)) continue;  
  36.                    }                           
  37.              %>           
  38.             <td width="100" height="140"><img src="images/<%=String.valueOf(b.getBookId()-1) %>.jpg"/></td>  
  39.             <td width="160">   
  40.                  <font color="#0000FF" face="隶书">ISDN :<%=b.getBookId() %></font><br>  
  41.                  <font color="#0000FF" face="隶书"> 书 名:<%=b.getName() %></font><br>  
  42.                  <font color="#0000FF" face="隶书"> 作 者:<%=b.getAuthor() %></font><br>  
  43.                  <font color="#0000FF" face="隶书">出 版:<%=b.getPublisher() %></font><br>  
  44.                  <font color="#0000FF" face="隶书">价 格:<%=b.getPrice() %> </font><br>     
  45.                     <a href="BookInfo/<%=b.getBookId()%>.jsp?bookid=<%=b.getBookId()%>">查看详细信息</a>                             
  46.             </td>   
  47.                <% if(b.getBookId()%3==0) break; %>                           
  48.           <%} %>     
  49.           </tr>  
  50.           <%} %>           
  51.           <tr>  
  52.             <td align="right" colspan="6"><%= request.getAttribute("bar") %></td>            
  53.           </tr>  
  54.        </table>  
  55.   </body>  
  56. </html>  
结果图：



点击“查看详细信息”会把该书的bookId放入request中，然后跳转到相应的书的详细信息页：

Id=1的书的代码，1.jsp

[html]  view plain  copy
 print ?
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <%@ page import="com.Dao.BookDao" %>  
  3. <%@ page import="com.beans.Book" %>  
  4. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  5. <html>  
  6.   <head>  
  7.     <title>三国演义</title>  
  8.     <!-- 
  9.     <link rel="stylesheet" type="text/css" href="styles.css"> 
  10.     -->  
  11.     <style type="text/css">  
  12.         a:link{color:blue;text-decoration:none}/*未访问，红色，无下划线*/  
  13.         a:active{color:blue;}/*激活，红色*/  
  14.         a:visited{color:yellow;text-decoration:none}/*已访问，紫色，无下划线*/  
  15.         a:hover{color:blue;text-decoration:underline}/*鼠标移动上面，蓝色，下划线*/  
  16.     </style>  
  17.   
  18.   </head>   
  19.   <body  bgcolor="#98FB98" >  
  20.         <% int bookid=Integer.parseInt(request.getParameter("bookid"));    
  21.             BookDao bookdao=new BookDao();     
  22.             Book b=bookdao.getBookById(bookid);    
  23.             String msg=(String)request.getAttribute("msg");                     
  24.          %>  
  25.          
  26.         <br><br><br><br>  
  27.       <form action="http://localhost:8080/ShoppingCart/CheckLogin?bookid=<%=b.getBookId() %>" method="post" name="checkform">  
  28.         <table align="center"  width="800">  
  29.              <tr>  
  30.                 <td width="100" height="140"><img src="Http://localhost:8080/ShoppingCart/images/<%=String.valueOf(b.getBookId()-1) %>.jpg"/></td>  
  31.                 <td >   
  32.                   <font color="#000000" face="隶书" size="4">ISDN :<%=b.getBookId() %></font><br>  
  33.                   <font color="#000000" face="隶书" size="4"> 书 名:<%=b.getName() %></font><br>  
  34.                   <font color="#000000" face="隶书" size="4"> 作 者:<%=b.getAuthor() %></font><br>  
  35.                   <font color="#000000" face="隶书" size="4">出 版:<%=b.getPublisher() %></font><br>  
  36.                   <font color="#000000" face="隶书" size="4">价 格:<%=b.getPrice() %> </font><br>                                             
  37.                 </td>   
  38.              </tr>  
  39.              <tr><td colspan="2"> <hr color="#FF0000"></td></tr>    
  40.                
  41.              <tr>  
  42.                <td colspan="2"> <h2><font color="#8B0000" face="隶书">简介：</font></h2></td>  
  43.              </tr>    
  44.                
  45.              <tr>  
  46.                <td colspan="2">    
  47.                <p style="font-family:'楷体'">      《三国演义》是中国第一部长篇章回体历史演义小说，以描写东汉末年的战争为主，反映了魏、蜀、吴三个政治集团之间的政治和军事斗争。分为黄巾之乱、董卓之乱、三国鼎立三大部分。在广阔的背景上，上演了一幕幕气势磅礴的战争场面。</p>  
  48.                <p style="font-family:'楷体'">      罗贯中将兵法三十六计融于字里行间，既有情节，也有兵法韬略。本书反映了丰富的历史内容，人物名称、地理名称、主要事件和人物性格与《三国志》基本相同，是在固定形象基础上，进行再发挥，这也是历史演义小说的套路。本书一方面反映了真实的三国历史，照顾到读者希望了解真实历史的需要；另一方面，根据明朝社会的实际情况对三国人物进行了夸张、美化、丑化等等。</p></td>  
  49.              </tr>  
  50.                  
  51.               <tr>  
  52.                 <td colspan="2" align="right">                  
  53.                 <input value="加入购物车" type="submit">  <a href="Http://localhost:8080/ShoppingCart/PageQueryServlet">继续购物</a></td>  
  54.                </tr>           
  55.         </table>                
  56.      </form>  
  57.        <% if(msg!=null){ %>  
  58.               <%=msg %>  
  59.          <%} %>  
  60.   </body>  
  61. </html>  

结果图：

在该页面中点击“加入购物车”，请求会提交到CheckLogin的Servlet，在该Servlet中完成检查用户有无登录的操作和将书加入到该用户的购物车的操作。如果用户为登录会“用户为登录”窗口提示信息，如果登录了，就成功加入了该用户的购物车，感觉淘宝的模式有点像，点击该用户的“查看我的购物车”即可看到刚加的书籍。若购物车中有书籍会提示“此书已加入购物车，请勿重复添加！”，只需在购物车中调整购买数量即可。

CheckLogin.java

[java]  view plain  copy
 print ?
  1. package com.servlets;  
  2.   
  3. import java.io.IOException;  
  4. import java.io.PrintWriter;  
  5.   
  6. import javax.servlet.ServletException;  
  7. import javax.servlet.http.HttpServlet;  
  8. import javax.servlet.http.HttpServletRequest;  
  9. import javax.servlet.http.HttpServletResponse;  
  10. import javax.servlet.http.HttpSession;  
  11.   
  12. import com.Dao.BookDao;  
  13. import com.Dao.CartDao;  
  14. import com.beans.Book;  
  15.   
  16. public class CheckLogin extends HttpServlet {  
  17.     public void doPost(HttpServletRequest request, HttpServletResponse response)  
  18.             throws ServletException, IOException {  
  19.         response.setCharacterEncoding("gb2312");  
  20.         HttpSession session=request.getSession();   
  21.         //String user=(String) session.getAttribute("user");//从session中获取用户  
  22.           
  23.         System.out.println("加入购物车");  
  24.         String bookid=request.getParameter("bookid");  
  25.         BookDao bookdao=new BookDao();  
  26.         Book b=bookdao.getBookById(Integer.parseInt(bookid));//通过传过来的bookid返回书的对象  
  27.           
  28.         System.out.println("以获取用户");  
  29.         if( session.getAttribute("userid")==null){//如果用户未登录  
  30.             System.out.println("用户未空");  
  31.             request.setAttribute("msg", "<script language='javascript'>window.alert('用户未登录！');</script>");  
  32.             request.getRequestDispatcher("BookInfo/"+b.getBookId()+".jsp").forward(request, response);  
  33.         }  
  34.         else{  
  35.             //加入购物车的操作            
  36.             CartDao cartdao=new CartDao();  
  37.             String userid=(String)session.getAttribute("userid");  
  38.             //System.out.println(b.getName());  
  39.             //System.out.println((String)session.getAttribute("userid"));     
  40.             boolean cc=cartdao.isContainBook(userid, bookid);  
  41.             if(cc){//如果此书已添加  
  42.                 request.setAttribute("msg", "<script language='javascript'>window.alert('此书已加入购物车，请勿重复添加！');</script>");  
  43.                 request.getRequestDispatcher("BookInfo/"+b.getBookId()+".jsp").forward(request, response);  
  44.             }else{//如果此书没添加  
  45.                   
  46.                 boolean bb=cartdao.InsertBook((String)session.getAttribute("userid"), b);  
  47.                 if(bb){//如果插入书籍成功  
  48.                     /*PrintWriter out=response.getWriter(); 
  49.                     out.print("<script language='javascript'>window.alert('成功加入购物车！');</script>");               
  50.                     out.flush(); 
  51.                     out.close();*/  
  52.                     request.setAttribute("msg", "<script language='javascript'>window.alert('成功加入购物车！');</script>");  
  53.                     request.getRequestDispatcher("BookInfo/"+b.getBookId()+".jsp").forward(request, response);  
  54.                 }  
  55.                 else{     
  56.                     request.setAttribute("msg", "<script language='javascript'>window.alert('加入购物车失败！');</script>");  
  57.                     request.getRequestDispatcher("BookInfo/"+b.getBookId()+".jsp").forward(request, response);  
  58.                 }  
  59.                   
  60.             }             
  61.         }  
  62.     }  
  63.   
  64. }  

6.2用户注册和用户登录功能

在用户登录使用之前用户首先要注册，注册过程我采用的是为每个用户新建一张表，这张表就代表了该用户的购物车，存放的是该用户选购的书籍

Register.jsp是显示注册的代码

[html]  view plain  copy
 print ?
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2.   
  3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  4. <html>  
  5.   <head>  
  6.     <title>用户注册</title>  
  7.     <!-- 
  8.     <link rel="stylesheet" type="text/css" href="styles.css"> 
  9.     -->  
  10.     <script type="text/javascript">  
  11.           var select=document.getElementByName("header");  
  12.           var options=select.getElementsByTagName("option");  
  13.           var placeholder=document.getElementsByName("place");  
  14.           function selectheader(){  
  15.                placeholder.src=select.value;  
  16.                  
  17.           }  
  18.     </script>  
  19.     <script type="text/javascript">  
  20.        function login(){  
  21.             if(document.registerform.ID.value==""){  
  22.               window.alert("账号不能为空！");  
  23.               return ;  
  24.             }  
  25.             if(document.registerform.Password.value==""){  
  26.               window.alert("密码不能为空！");  
  27.               return ;  
  28.             }  
  29.             registerform.submit();  
  30.        }  
  31.         function cancelregister(){  
  32.             document.registerform.method="post";  
  33.             document.registerform.target="_top";  
  34.             document.registerform.action="http://localhost:8080/ShoppingCart/frame.jsp";  
  35.             document.registerform.submit();  
  36.         }  
  37.          
  38.     </script>  
  39.   </head>  
  40.   <body bgcolor="#98FB98">  
  41.     <br><br><br><br>  
  42.     <form action="RegServlet" name="registerform" method="post">  
  43.                  
  44.        <table align="center"  width="300" >  
  45.          <tr>  
  46.             <td colspan="2" align="center" style="color:#00F;font-size;36px" rowspan="1"><b>用户注册</b></td>  
  47.          </tr>  
  48.          <tr>  
  49.             <td>账    号：</td>  
  50.             <td><input name="ID" type="text" > </td>  
  51.          </tr>  
  52.          <tr>  
  53.             <td>密    码：</td>  
  54.             <td><input name="Password" type="password" > </td>  
  55.          </tr>  
  56.          <tr>  
  57.             <td>性    别:</td>  
  58.             <td><input name="Sex" type="radio" value="男">男 <input name="Sex" type="radio" value="女">女</td><!--单选按钮-->  
  59.          </tr>  
  60.          <tr>  
  61.            <td>电话号码：</td>  
  62.            <td><input name="Phone" type="text"/></td>  
  63.          </tr>  
  64.         <tr>  
  65.             <td>家    乡：</td>  
  66.             <td>  
  67.               <select name="Home" ><!--下拉列表-->  
  68.                 <option value="北    京">北     京</option>  
  69.                 <option value="上   海">上   海</option>  
  70.                 <option value="广   州">广   州</option>  
  71.                 <option value="深    圳">深    圳</option>               
  72.               </select>  
  73.              </td>  
  74.          </tr>  
  75.          <tr>  
  76.            <td>电子邮件：</td>  
  77.            <td><input name="Email" type="text"/></td>  
  78.          </tr>  
  79.          <tr>  
  80.              <td>上传头像：</td>  
  81.              <td >  
  82.                 <div  style="border:1px solid;width:50px;height:50px;" >  
  83.                    <img name="place" src="Sheader/1.jpg" width="50" height="50"></img>                 
  84.                  </div>    
  85.                   <select name="Header" style="width:50px;" onclick="selectheader()"><!--下拉列表-->  
  86.                      <option value="Sheader/1.jpg" >1</option>  
  87.                      <option value="Sheader/2.jpg" >2</option>  
  88.                      <option value="Sheader/3.jpg" >3</option>  
  89.                      <option value="Sheader/4.jpg" >4</option>  
  90.                      <option value="Sheader/5.jpg" >5</option>      
  91.                      <option value="Sheader/6.jpg" >6</option>      
  92.                      <option value="Sheader/7.jpg" >7</option>      
  93.                      <option value="Sheader/8.jpg" >8</option>      
  94.                      <option value="Sheader/9.jpg" >9</option>      
  95.                      <option value="Sheader/10.jpg" >10</option>                   
  96.                 </select>                                                                     
  97.              </td>               
  98.          </tr>  
  99.          <tr>  
  100.             <td></td>  
  101.             <td><input type="submit" value=" 注    册 " > <input type="button" value=" 取    消 "  onclick="cancelregister()"></td>  
  102.          </tr>  
  103.        </table>           
  104.      </form>  
  105.   </body>  
  106. </html>  
结果图：


该注册页面点击“取消”会返回显示书籍的主页面，点击“注册”请求提交到RegServlet，注册成功之后会弹出一个注册成功提示框并且数据库会生成以账号为表名的表：


RegServlet.java

[java]  view plain  copy
 print ?
  1. package com.servlets;  
  2.   
  3. import java.io.IOException;  
  4. import java.io.PrintWriter;  
  5. import java.sql.Connection;  
  6. import java.sql.PreparedStatement;  
  7. import java.sql.SQLException;  
  8.   
  9. import javax.servlet.ServletException;  
  10. import javax.servlet.http.HttpServlet;  
  11. import javax.servlet.http.HttpServletRequest;  
  12. import javax.servlet.http.HttpServletResponse;  
  13.   
  14. import com.Dao.UserDao;  
  15. import com.tools.DBConnection;  
  16.   
  17. public class RegServlet extends HttpServlet {  
  18.       
  19.   
  20.     private static final long serialVersionUID = 1L;  
  21.   
  22.     public void doPost(HttpServletRequest request, HttpServletResponse response)  
  23.             throws ServletException, IOException {  
  24.            request.setCharacterEncoding("UTF-8");  
  25.            response.setCharacterEncoding("UTF-8");  
  26.            response.setContentType("text/html");  
  27.              
  28.            String id= request.getParameter("ID");  
  29.            String password=request.getParameter("Password");  
  30.            String sex= request.getParameter("Sex");  
  31.            String phone=request.getParameter("Phone");  
  32.            String home=request.getParameter("Home");  
  33.            String email=request.getParameter("Email");  
  34.            String header=request.getParameter("Header");  
  35.              
  36.            DBConnection DB=new DBConnection();  
  37.            Connection conn=null;  
  38.            conn=DB.getCon();  
  39.      if(conn!=null){      
  40.         try {  
  41.              UserDao dao=new UserDao();  
  42.             if(!dao.isContainUser(id)){//是否存在用户                
  43.                 String sql="insert into users values(?,?,?,?,?,?,?)";  
  44.                 PreparedStatement pstm=conn.prepareStatement(sql);  
  45.                 pstm.setString(1, id);  
  46.                 pstm.setString(2, password);  
  47.                 pstm.setString(3, sex);  
  48.                 pstm.setString(4, phone);  
  49.                 pstm.setString(5, home);  
  50.                 pstm.setString(6, email);  
  51.                 pstm.setString(7, header);  
  52.                 pstm.executeUpdate();  
  53.                 System.out.println("注册成功！");  
  54.                 //同时新建一张购车表，即每个用户注册成功都会建一张表  
  55.                 String sql1="create table "+id+"(ID int(20),Name varchar(20),Price varchar(20),Num int(20),Total int(20),primary key(ID))";  
  56.                 PreparedStatement pstm1=conn.prepareStatement(sql1);  
  57.                 pstm1.executeUpdate();  
  58.                 response.sendRedirect("Http://localhost:8080/ShoppingCart/PageQueryServlet");//登录成功后重定向到books界面  
  59.             }  
  60.             else{  
  61.                 PrintWriter out=response.getWriter();  
  62.                 out.print("<script language='javascript'>window.alert('注册失败！');</script>");               
  63.                 out.flush();  
  64.                 out.close();  
  65.                 System.out.println("用户已存在！");  
  66.             }  
  67.                   
  68.              
  69.         } catch (SQLException e) {  
  70.             // TODO Auto-generated catch block  
  71.             e.printStackTrace();  
  72.         }  
  73.              
  74.     }  
  75.     }  
  76. }  

Bug分析：

本来想搞个上传头像的功能，但是感觉图片规格大小之类的技术不太会，只想出了使用剪辑好了的图片作为备选项，想实现选中了某个头像就更换显示对应的头像，这涉及了web前端的JavaScript知识，我只懂一点点，所以就没有修改了……

用户登录功能：

Login.jsp

[html]  view plain  copy
 print ?
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2.   
  3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  4. <html>  
  5.   <head>  
  6.     <title>网上书店</title>  
  7.       <script language="javascript" src="JS/AjaxRequest.js"></script>  
  8.      <!--javascript语言写的代码块-->  
  9.     <script type="text/javascript">  
  10.        function login(){  
  11.             if(document.loginform.id.value==""){  
  12.               window.alert("账号不能为空！");  
  13.               return ;  
  14.             }  
  15.             if(document.loginform.password.value==""){  
  16.               window.alert("密码不能为空！");  
  17.               return ;  
  18.             }  
  19.             loginform.submit();  
  20.        }  
  21.         function register(){  
  22.             document.loginform.method="post";  
  23.             document.loginform.target="rightframe";  
  24.             document.loginform.action="register.jsp";  
  25.             document.loginform.submit();  
  26.         }  
  27.          
  28.     </script>  
  29.      <script type="text/javascript">  
  30.        /***********错误处理方法*********/  
  31.        function onerror(){  
  32.          alert("您的操作有误！");  
  33.        }  
  34.         /***********实例化ajax对象的方法*********/  
  35.        function getInfo(){  
  36.            var loader=new net.AjaxRequest("getInfo.jsp?nocache="+new Date().getTime(),deal_getInfo,onerror,"GET");  
  37.              
  38.        }  
  39.         /***********回调函数*********/  
  40.        function deal_getInfo(){  
  41.           document.getElementById("showInfo").innerHTML=this.req.responseText;  
  42.        }  
  43.          
  44.        window.onload=function(){  
  45.             getInfo();  //调用getInfo()方法获取公告信息  
  46.             window.setInterval("getInfo()", 600000);    //每隔10分钟调用一次getInfo()方法  
  47.        }  
  48.      </script>  
  49.      <style type="text/css">  
  50.         a:link{color:red;text-decoration:none}/*未访问，红色，无下划线*/  
  51.         a:active{color:blue;}/*激活，红色*/  
  52.         a:visited{color:yellow;text-decoration:none}/*已访问，紫色，无下划线*/  
  53.         a:hover{color:blue;text-decoration:underline}/*鼠标移动上面，蓝色，下划线*/  
  54.      </style>  
  55.   </head>  
  56.   <body bgcolor="#98FB98" >  
  57.        <form action="LoginServlet" name="loginform" method="post">  
  58.          <h2 align="center" style=" font-family:隶书">欢迎登陆网上书店系统</h2><br>           
  59.        <table align="center" style="border:1px solid">  
  60.          <tr>  
  61.             <td><font color="blue"><b>账 号：</b></font></td>  
  62.             <td><input name="id" type="text"> </td>  
  63.          </tr>  
  64.          <tr>  
  65.             <td><font color="blue"><b>密 码：</b></font></td>  
  66.             <td><input name="password" type="password" size="20"> </td>  
  67.          </tr>  
  68.          <tr>  
  69.             <td></td>  
  70.             <td><input type="button" value="登  录" onclick="login()">  
  71.                   
  72.              <input type="button" value="立即注册" onclick="register()">    
  73.             </td>            
  74.          </tr>  
  75.        </table>            
  76.      </form>  
  77.       <table align="center" style="border:1px solid">  
  78.        <tr bgcolor="#FF0000">  
  79.           <td colspan="2" >  
  80.                                   公告信息：  
  81.           </td>  
  82.        </tr>   
  83.          <tr >  
  84.             <td colspan="2" width="215" height="100">         
  85.                 <marquee direction="up" scrollamount="3" onmouseout="this.start()" onmouseover="this.stop()">  
  86.                   <div id="showInfo" ></div>  
  87.                 </marquee>  
  88.             </td>  
  89.          </tr>  
  90.          <tr bgcolor="#FF0000">  
  91.           <td colspan="2" >  
  92.                                   友情链接：  
  93.           </td>  
  94.        </tr>   
  95.        <tr >  
  96.           <td colspan="2" >  
  97.             <a href="http://www.hust.edu.cn/" target="_blank"><font face="隶书" color="#FF4500" size="4">华中科技大学</font></a><br>  
  98.             <a href="http://portal.ccnu.edu.cn/" target="_blank"><font face="隶书" color="#FF4500" size="4">华中师范大学</font></a><br>  
  99.             <a href="http://www.cug.edu.cn/new/" target="_blank"><font face="隶书" color="#FF4500" size="4">中国地质大学</font></a><br>  
  100.             <a href="http://www.whut.edu.cn/2015web/index.htm" target="_blank"><font face="隶书" color="#FF4500" size="4">武汉理工大学</font></a>                             
  101.           </td>  
  102.        </tr>   
  103.        </table>  
  104.   </body>  
  105. </html>  

该页面有三部分，登录框，公告信息，友情链接。

登录框很简单form提交到LoginServlet就可以了，在LoginServlet中查询数据库判断等操作：

LoginServlet.java

[java]  view plain  copy
 print ?
  1. package com.servlets;  
  2.   
  3. import java.io.IOException;  
  4. import java.io.PrintWriter;  
  5. import java.util.List;  
  6.   
  7. import javax.servlet.ServletException;  
  8. import javax.servlet.http.HttpServlet;  
  9. import javax.servlet.http.HttpServletRequest;  
  10. import javax.servlet.http.HttpServletResponse;  
  11. import javax.servlet.http.HttpSession;  
  12.   
  13. import com.Dao.BookDao;  
  14. import com.Dao.UserDao;  
  15. import com.beans.Book;  
  16. import com.beans.User;  
  17.   
  18. public class LoginServlet extends HttpServlet {  
  19.   
  20.     private static final long serialVersionUID = 1L;  
  21.     protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
  22.         doPost(request, response);  
  23.     }  
  24.     public void doPost(HttpServletRequest request, HttpServletResponse response)  
  25.             throws ServletException, IOException {  
  26.         request.setCharacterEncoding("UTF-8");  
  27.         response.setCharacterEncoding("UTF-8");  
  28.         response.setContentType("text/html");  
  29.         System.out.println("接收数据");  
  30.         String id=request.getParameter("id");//获得用户名  
  31.         String password=request.getParameter("password");//获得密码  
  32.         UserDao dao=new UserDao();  
  33.         BookDao bdao=new BookDao();  
  34.         User user=null;  
  35.         user=dao.getUser(id, password);  
  36.         HttpSession session=request.getSession();  
  37.           
  38.         if(user!=null){  
  39.             System.out.println("用户已查到");  
  40.             session.setAttribute("userid",user.getID());//把查到的用户放进session中，便于登录检查         
  41.             response.sendRedirect("loginsuccess.jsp");  
  42.         }  
  43.         else  
  44.         {  
  45.             PrintWriter out=response.getWriter();  
  46.             out.print("<script type='text/javascript'>");  
  47.             out.print("window.alert('用户名或密码不正确！');");  
  48.             out.print("</script>");  
  49.             out.flush();  
  50.             out.close();  
  51.         }  
  52.          
  53.     }  
  54.   
  55. }  

公告信息采用Ajax技术，不刷新页面更新

关键代码：

[html]  view plain  copy
 print ?
  1. <tr bgcolor="#FF0000">  
  2.           <td colspan="2" >  
  3.                 公告信息：  
  4.           </td>  
  5.        </tr>   
  6.          <tr >  
  7.             <td colspan="2" width="215" height="100">         
  8.                 <marquee direction="up" scrollamount="3" onmouseout="this.start()" onmouseover="this.stop()">  
  9.                   <div id="showInfo" ></div>  
  10.                 </marquee>  
  11.             </td>  
  12.          </tr>  

主要是javascript代码

[javascript]  view plain  copy
 print ?
  1. <script type="text/javascript">  
  2.        /***********错误处理方法*********/  
  3.        function onerror(){  
  4.          alert("您的操作有误！");  
  5.        }  
  6.         /***********实例化ajax对象的方法*********/  
  7.        function getInfo(){  
  8.            var loader=new net.AjaxRequest("getInfo.jsp?nocache="+new Date().getTime(),deal_getInfo,onerror,"GET");  
  9.              
  10.        }  
  11.         /***********回调函数*********/  
  12.        function deal_getInfo(){  
  13.           document.getElementById("showInfo").innerHTML=this.req.responseText;  
  14.        }  
  15.          
  16.        window.onload=function(){  
  17.             getInfo();  //调用getInfo()方法获取公告信息  
  18.             window.setInterval("getInfo()", 600000);    //每隔10分钟调用一次getInfo()方法  
  19.        }  
  20.      </script>  
结果图：

6.3查看购物车，商品结算和生成订单功能

点击“查看我的购物车”，表单提交到CartServlet，在此CartServlet中查询该用户的购物车表，查询所有已添加到购物车的书籍，并请求转发到Carts.jsp

CartServlet.java

[java]  view plain  copy
 print ?
  1. package com.servlets;  
  2.   
  3. import java.io.IOException;  
  4. import java.io.PrintWriter;  
  5. import java.util.List;  
  6.   
  7. import javax.servlet.ServletException;  
  8. import javax.servlet.http.HttpServlet;  
  9. import javax.servlet.http.HttpServletRequest;  
  10. import javax.servlet.http.HttpServletResponse;  
  11. import javax.servlet.http.HttpSession;  
  12.   
  13. import com.Dao.CartDao;  
  14. import com.beans.CartBook;  
  15.   
  16. public class CartServlet extends HttpServlet {  
  17.   
  18.     protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
  19.         doPost(request, response);  
  20.     }  
  21.     public void doPost(HttpServletRequest request, HttpServletResponse response)  
  22.             throws ServletException, IOException {  
  23.             HttpSession session=request.getSession();  
  24.             String userId=(String) session.getAttribute("userid");//登录成功后用户的Id放在session中  
  25.             System.out.println(userId);  
  26.               
  27.             String m=request.getParameter("m");//删除书籍的时候判断标记  
  28.             if(m!=null){  
  29.                  if(m.equals("1")){  
  30.                   request.setAttribute("msg", "<script language='javascript'>window.alert('成功删除！');</script>");  
  31.                }  
  32.                else if(m.equals("0")){  
  33.                 request.setAttribute("msg", "<script language='javascript'>window.alert('删除失败！');</script>");  
  34.                }  
  35.                else if(m.equals("2")){  
  36.                    request.setAttribute("msg", "<script language='javascript'>window.alert('清空购物车失败！');</script>");  
  37.                }  
  38.             }  
  39.                        
  40.             CartDao ccdao=new CartDao();  
  41.             List<CartBook> list=ccdao.getAllCartBooks((String)session.getAttribute("userid"));  
  42.             request.setAttribute("booklist", list);//把已购买的书单放进request中  
  43.             request.getRequestDispatcher("Carts.jsp").forward(request, response);             
  44.     }  
  45.       
  46. }  

Carts.jsp

[html]  view plain  copy
 print ?
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <%@ page import="com.beans.CartBook" import="com.Dao.CartDao"%>  
  3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  4. <html>  
  5.   <head>  
  6.     <title>购物车</title>  
  7.     <!-- 
  8.     <link rel="stylesheet" type="text/css" href="styles.css"> 
  9.     -->  
  10.     <style type="text/css">  
  11.         a:link{color:#FF4500;text-decoration:none}/*未访问，红色，无下划线*/  
  12.         a:active{color:blue;}/*激活，红色*/  
  13.         a:visited{color:red;text-decoration:none}/*已访问，紫色，无下划线*/  
  14.         a:hover{color:yellow;text-decoration:underline}/*鼠标移动上面，蓝色，下划线*/  
  15.     </style>  
  16.   
  17.   </head>    
  18.   <body bgcolor="#98FB98">  
  19.     <br> <br> <br>  
  20.        
  21.        <table align="center"   width="900" >  
  22.           <tr bgcolor="#ff0000" >  
  23.              <td colspan="8"><font face="隶书" size="5" >我的购物车</font></td>  
  24.           </tr>  
  25.           <tr>  
  26.             <td width="60" align="center" ><font color="blue"><b>商品</b></font></td>  
  27.             <td align="center" ><font color="blue"><b>商品名称</b></font></td>  
  28.             <td align="center"><font color="blue"><b>价格</b></font></td>  
  29.              <td align="center" width="20"></td>  
  30.             <td align="center" width="60"><font color="blue"><b>数量</b></font></td>  
  31.             <td align="center" width="20"></td>  
  32.             <td align="center"><font color="blue"><b>总价</b></font></td>            
  33.             <td align="center"><font color="blue"><b>操作</b></font></td>  
  34.           </tr>  
  35.            <tr>  
  36.             <td colspan="8"><hr></td>  
  37.           </tr>  
  38.           <%   
  39.              List<CartBook> list=(List<CartBook>)request.getAttribute("booklist");  
  40.               String userid=(String) session.getAttribute("userid");  
  41.               CartDao cdao=new CartDao();  
  42.               int total=cdao.getTotalPrice(userid);   
  43.              // int total=0;    
  44.               int i=1;        
  45.               System.out.print(list.size());            
  46.           %>  
  47.           <%   
  48.             if(list.size()==0){  
  49.           %>   
  50.             <tr>  
  51.                <td colspan="8" align="center" height="30">请添加书籍!</td>  
  52.             </tr>  
  53.           <%       
  54.             }  
  55.             else{  
  56.               
  57.              for(i=0;i<list.size();i++){  
  58.           %>  
  59.            <tr align="center">  
  60.              <td height="80" width="60"><img src="Simages/<%=list.get(i).getBookId()-1 %>.jpg"></td>  
  61.              <td align="center"><%=list.get(i).getName() %></td>  
  62.              <td align="center">￥<%=list.get(i).getPrice()%></td>  
  63.              <td align="center" width="20">                           
  64.              <form action="UpdateNumServlet?bookidtext=<%=list.get(i).getBookId() %>" method="post" name="numform"><!--减数量 -->  
  65.                 <br>   
  66.                 <input value="-" type="submit" name="sub" >                
  67.                 <input type="hidden" value="-1" name="hid">   
  68.               </form>  
  69.              </td>  
  70.                  
  71.               <td align="center"  width="60">   
  72.                <input type="text"   size="10" readonly  value="<%=list.get(i).getNum() %>" style="text-align:center">   
  73.               </td>  
  74.                 
  75.              <td align="center" width="20">  
  76.              <form action="UpdateNumServlet?bookidtext=<%=list.get(i).getBookId() %>" method="post" ><!-- 加数量 -->   
  77.                 <br>   
  78.                 <input value="+" type="submit" name="add" >  
  79.                 <input type="hidden" value="1" name="hid">   
  80.              </form>       
  81.              </td>  
  82.              <td align="center">￥<%=list.get(i).getTotal()%></td>  
  83.              <td align="center">  
  84.               <a href="http://localhost:8080/ShoppingCart/DeleteBookServlet?bookid=<%=list.get(i).getBookId()%>">删除</a>              
  85.              </td>  
  86.            </tr>           
  87.           <%} }%>  
  88.           <tr>  
  89.             <td colspan="8"><hr></td>  
  90.           </tr>  
  91.           <tr>   
  92.              <td width="80">总金额：</td>   
  93.              <td colspan="7">￥<%=total %></td>  
  94.            </tr>   
  95.           <tr>  
  96.             <td colspan="8"><hr></td>  
  97.           </tr>  
  98.           <tr>  
  99.             <td colspan="2">              
  100.                 
  101.             <a href="ClearCartServlet">清空购物车</a>  
  102.             </td>  
  103.             <td align="right"  colspan="6" valign="bottom">  
  104.               <form action="orders.jsp" method="post">  
  105.                  <br>  
  106.                 <input value="商品结算" type="submit">   <a href="http://localhost:8080/ShoppingCart/PageQueryServlet">返回继续购物</a>  
  107.               </form>            
  108.             </td>  
  109.           </tr>    
  110.           <tr>  
  111.             <td colspan="8"><hr></td>  
  112.           </tr>         
  113.        </table>  
  114.         <%   
  115.          String msg=(String)request.getAttribute("msg");  //弹窗信息  
  116.       if(msg!=null){ %>  
  117.               <%=msg %>  
  118.          <%} %>  
  119.   </body>  
  120. </html>  

购物车结果图：


在这个购物车页面中会有比较多的功能,比如：删除书籍，清空购物车，修改书籍数量，商品结算等功能

删除书籍：
点击“删除”请求提交到DeleteBookServlet，该Servlet中实现删除操作

DeleteBookServlet.java

[java]  view plain  copy
 print ?
  1. package com.servlets;  
  2.   
  3. import java.io.IOException;  
  4. import java.io.PrintWriter;  
  5.   
  6. import javax.servlet.ServletException;  
  7. import javax.servlet.http.HttpServlet;  
  8. import javax.servlet.http.HttpServletRequest;  
  9. import javax.servlet.http.HttpServletResponse;  
  10. import javax.servlet.http.HttpSession;  
  11.   
  12. import com.Dao.CartDao;  
  13.   
  14. public class DeleteBookServlet extends HttpServlet {  
  15.   
  16.     private static final long serialVersionUID = 1L;  
  17.     protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
  18.         doPost(request, response);  
  19.     }  
  20.     public void doPost(HttpServletRequest request, HttpServletResponse response)  
  21.             throws ServletException, IOException {  
  22.            request.setCharacterEncoding("UTF-8");  
  23.            response.setCharacterEncoding("UTF-8");  
  24.            HttpSession session=request.getSession();  
  25.            String userid=(String)session.getAttribute("userid");  
  26.            String bookid=request.getParameter("bookid");  
  27.              
  28.            CartDao cartdao=new CartDao();  
  29.            boolean b=cartdao.DeleteBook(userid, Integer.parseInt(bookid));//删除书籍  
  30.            if(b){  
  31.                System.out.println("删除成功");        
  32.                response.sendRedirect("http://localhost:8080/ShoppingCart/CartServlet?m=1");  
  33.            }  
  34.            else{  
  35.                  
  36.                response.sendRedirect("http://localhost:8080/ShoppingCart/CartServlet?m=0");  
  37.            }          
  38.     }  
  39.   
  40. }  

清空购物车：

点击“清空购物车”，请求提交到ClearCartServlet

ClearCartServlet.java

[java]  view plain  copy
 print ?
  1. package com.servlets;  
  2.   
  3. import java.io.IOException;  
  4. import java.io.PrintWriter;  
  5.   
  6. import javax.servlet.ServletException;  
  7. import javax.servlet.http.HttpServlet;  
  8. import javax.servlet.http.HttpServletRequest;  
  9. import javax.servlet.http.HttpServletResponse;  
  10. import javax.servlet.http.HttpSession;  
  11.   
  12. import com.Dao.CartDao;  
  13.   
  14. public class ClearCartServlet extends HttpServlet {  
  15.   
  16.     protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
  17.         doPost(request, response);  
  18.     }  
  19.     public void doPost(HttpServletRequest request, HttpServletResponse response)  
  20.             throws ServletException, IOException {  
  21.              
  22.            HttpSession session=request.getSession();  
  23.            String userid=(String)session.getAttribute("userid");  
  24.              
  25.            CartDao cd=new CartDao();  
  26.             boolean b=cd.ClearCartBook(userid);  
  27.             if(b){  
  28.                 response.sendRedirect("http://localhost:8080/ShoppingCart/CartServlet");  
  29.             }  
  30.             else{  
  31.                 response.sendRedirect("http://localhost:8080/ShoppingCart/CartServlet?m=2");  
  32.             }  
  33.     }  
  34.   
  35. }  

修改书籍数量:点击“+”/“-”操作，请求提交到UpdateNumServlet，修改数量之后总价格也会变化，修改完成之后重定向到本页面

UpdateNumServlet.java

[java]  view plain  copy
 print ?
  1. package com.servlets;  
  2.   
  3. import java.io.IOException;  
  4. import java.io.PrintWriter;  
  5.   
  6. import javax.servlet.ServletException;  
  7. import javax.servlet.http.HttpServlet;  
  8. import javax.servlet.http.HttpServletRequest;  
  9. import javax.servlet.http.HttpServletResponse;  
  10. import javax.servlet.http.HttpSession;  
  11.   
  12. import com.Dao.CartDao;  
  13.   
  14. public class UpdateNumServlet extends HttpServlet {  
  15.   
  16.     private static final long serialVersionUID = 1L;  
  17.   
  18.     public void doPost(HttpServletRequest request, HttpServletResponse response)  
  19.             throws ServletException, IOException {  
  20.            request.setCharacterEncoding("UTF-8");  
  21.            HttpSession session=request.getSession();  
  22.            String userid=(String)session.getAttribute("userid");  
  23.            int bookid=Integer.parseInt((String)request.getParameter("bookidtext"));  
  24.            String hid=(String)request.getParameter("hid");  
  25.            int dnum=Integer.parseInt(hid);//hid的值是+1，-1  
  26.              
  27.            CartDao cd=new CartDao();  
  28.            cd.ModifyNum(userid, bookid, dnum);  
  29.            System.out.println("进入修改数目servlet");  
  30.            response.sendRedirect("http://localhost:8080/ShoppingCart/CartServlet");  
  31.     }  
  32.   
  33. }  

商品结算：

点击“商品结算”，请求提交到orders.jsp

[html]  view plain  copy
 print ?
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2.   
  3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  4. <html>  
  5.   <head>  
  6.     <title>填写订单</title>  
  7.     <!-- 
  8.     <link rel="stylesheet" type="text/css" href="styles.css"> 
  9.     -->  
  10.   </head>    
  11.   <body bgcolor="#98FB98">  
  12.       <form action="OrderServlet" method="post">  
  13.       <br><br>  
  14.        <table align="center"  width="900" >  
  15.           <tr>  
  16.             <td colspan="2" bgcolor="#FFC125"><b>填写订单信息:</b></td>              
  17.           </tr>  
  18.           <tr>  
  19.             <td colspan="2"><hr></td>  
  20.           </tr>  
  21.           <tr >  
  22.             <td colspan="2" bgcolor="#FFE4B5">收货人信息</td>  
  23.           </tr>  
  24.           <tr>  
  25.             <td width="150">收  货  人：</td>  
  26.             <td><input type="text" name="receiver"></td>  
  27.           </tr>  
  28.            <tr>  
  29.             <td width="150">详细地址：</td>  
  30.             <td><input type="text" name="address" size="70"></td>  
  31.           </tr>  
  32.            <tr>  
  33.             <td width="150">邮政编码：</td>  
  34.             <td><input type="text" name="post"></td>  
  35.           </tr>  
  36.            <tr>  
  37.             <td width="150">移动电话：</td>  
  38.             <td><input type="text" name="mobile">         固定电话：<input type="text" name="fixphone">(如：027-12345678)</td>  
  39.           </tr>  
  40.           <tr  bgcolor="#FFE4B5">  
  41.              <td colspan="2">送货方式：</td>  
  42.           </tr>  
  43.           <tr>  
  44.             <td colspan="2" ><input type="radio" name="songhuoway" value="<b>普通快递送货上门  。</b>【运费5元】 ">普通快递送货上门     
  45.                             送货时间：  
  46.                    <select name="songhuotime" style="width:150px">  
  47.                          <option value="--请选择送货时间--" >--请选择送货时间--</colspan="2" ><input type="radio" name="songhuoway" value="<b>普通快递送货上门  。</b>【运费5元】 ">普通快递送货上门     
  48.                             送货时间：  
  49.                    <select name="songhuotime" style="width:150px">  
  50.                          <option value="--请选择送货时间--" >--请选择送货时间--</option>   
  51.                          <option value="送货时间：三天内." >三天内</option>  
  52.                      &n
相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程