1:首先设计用户表和图书表,设计的字段和类型如下图所示
1.1:用户表user
1.2:图书表book
2:第二写实体类user.java和book.java
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.po; 2 3 import java.io.Serializable; 4 5 /** 6 * @author BieHongLi 7 * @version 创建时间:2017年2月21日 上午9:59:03 8 * 用户的实体类 9 */ 10 public class User implements Serializable{ 11 12 //增加序列号 13 private static final long serialVersionUID = 1L; 14 private Integer id; 15 private String name; 16 private String password; 17 private String email; 18 private String phone; 19 public Integer getId() { 20 return id; 21 } 22 public void setId(Integer id) { 23 this.id = id; 24 } 25 public String getName() { 26 return name; 27 } 28 public void setName(String name) { 29 this.name = name; 30 } 31 public String getPassword() { 32 return password; 33 } 34 public void setPassword(String password) { 35 this.password = password; 36 } 37 public String getEmail() { 38 return email; 39 } 40 public void setEmail(String email) { 41 this.email = email; 42 } 43 public String getPhone() { 44 return phone; 45 } 46 public void setPhone(String phone) { 47 this.phone = phone; 48 } 49 50 //重写toString 方法 51 @Override 52 public String toString() { 53 return "User [id=" + id + ", name=" + name + ", password=" + password + ", email=" + email + ", phone=" + phone 54 + "]"; 55 } 56 57 58 }
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.po; 2 3 import java.io.Serializable; 4 5 /** 6 * @author BieHongLi 7 * @version 创建时间:2017年2月23日 上午10:19:08 8 * 图书的实体类 9 */ 10 public class Book implements Serializable{ 11 12 13 private static final long serialVersionUID = 1L; 14 private Integer bookid; 15 private String bookname; 16 private Double price; 17 private String author; 18 private String pic; 19 private String publish; 20 public Integer getBookid() { 21 return bookid; 22 } 23 public void setBookid(Integer bookid) { 24 this.bookid = bookid; 25 } 26 public String getBookname() { 27 return bookname; 28 } 29 public void setBookname(String bookname) { 30 this.bookname = bookname; 31 } 32 public Double getPrice() { 33 return price; 34 } 35 public void setPrice(Double price) { 36 this.price = price; 37 } 38 public String getAuthor() { 39 return author; 40 } 41 public void setAuthor(String author) { 42 this.author = author; 43 } 44 public String getPic() { 45 return pic; 46 } 47 public void setPic(String pic) { 48 this.pic = pic; 49 } 50 public String getPublish() { 51 return publish; 52 } 53 public void setPublish(String publish) { 54 this.publish = publish; 55 } 56 //重写toString()方法 57 @Override 58 public String toString() { 59 return "Book [bookid=" + bookid + ", bookname=" + bookname + ", price=" + price + ", author=" + author 60 + ", pic=" + pic + ", publish=" + publish + "]"; 61 } 62 63 64 }
3:第三写登陆页面login.jsp
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <% 4 //获取绝对路径路径 ,开发项目一定要使用绝对路径,不然肯定出错 5 String path = request.getContextPath(); 6 String basePath = request.getScheme() + "://" 7 + request.getServerName() + ":" + request.getServerPort() 8 + path + "/"; 9 %> 10 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 11 <html> 12 <head> 13 <base href="<%=basePath %>" /> 14 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 15 <title>用户登陆页面</title> 16 <style type="text/css"> 17 h1{text-align:left;} 18 h4{text-align:left;color:red;} 19 body{background:url(images/1.png)} 20 a{text-decoration:none;font-size:20px;color:black;} 21 a:hover{text-decoration:underline;font-size:24px;color:red;} 22 </style> 23 24 </head> 25 <body> 26 <form action="info.jsp" method="post"> 27 <h1>用户登陆页面</h1> 28 <h4>装饰中......</h4> 29 <hr/> 30 <table align="left"> 31 <tr> 32 <td>账号:</td> 33 <td><input type="text" name="name" id="name"></td> 34 </tr> 35 <tr> 36 <td>密码:</td> 37 <td><input type="password" name="password" id="password"></td> 38 <td><a href="searchPassword.jsp">找回密码</a></td> 39 </tr> 40 <tr> 41 <td colspan="1"> 42 </td> 43 <td> 44 <input type="submit" value="登陆"/> 45 <input type="reset" value="重置"/> 46 <a href="register.jsp" target="_blank">注册</a> 47 </td> 48 </tr> 49 </table> 50 </form> 51 </body> 52 </html>
4:写完登陆页面就需要实现登陆的功能了,开始写后台BaseDao.java连接数据库
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.utils; 2 3 import java.sql.Connection; 4 import java.sql.DriverManager; 5 import java.sql.PreparedStatement; 6 import java.sql.ResultSet; 7 import java.sql.SQLException; 8 import java.util.ResourceBundle; 9 10 11 /** 12 * @author BieHongLi 13 * @version 创建时间:2017年2月21日 上午10:01:14 14 * 数据交互层dao层 15 */ 16 public class BaseDao { 17 18 19 private static String driver="com.mysql.jdbc.Driver"; 20 private static String url="jdbc:mysql:///test"; 21 private static String user="root"; 22 private static String password="123456"; 23 24 /*** 25 * 连接数据库的方法 26 * @return 27 * @throws ClassNotFoundException 28 * @throws SQLException 29 */ 30 public static Connection getCon() throws ClassNotFoundException, SQLException{ 31 Class.forName(driver);//加载数据库驱动 32 System.out.println("测试加载数据库成功"); 33 Connection con=DriverManager.getConnection(url, user, password); 34 System.out.println("测试数据库链接成功"); 35 return con; 36 } 37 38 /*** 39 * 关闭数据库的方法 40 * @param con 41 * @param ps 42 * @param rs 43 */ 44 public static void close(Connection con,PreparedStatement ps,ResultSet rs){ 45 if(rs!=null){//关闭资源,避免出现异常 46 try { 47 rs.close(); 48 } catch (SQLException e) { 49 // TODO Auto-generated catch block 50 e.printStackTrace(); 51 } 52 } 53 if(ps!=null){ 54 try { 55 ps.close(); 56 } catch (SQLException e) { 57 // TODO Auto-generated catch block 58 e.printStackTrace(); 59 } 60 } 61 if(con!=null){ 62 try { 63 con.close(); 64 } catch (SQLException e) { 65 // TODO Auto-generated catch block 66 e.printStackTrace(); 67 } 68 } 69 } 70 71 /*** 72 * 同意增删改的方法 73 * @param sql 74 * @param arr 75 * @return 76 */ 77 public static boolean addUpdateDelete(String sql,Object[] arr){ 78 Connection con=null; 79 PreparedStatement ps=null; 80 try { 81 con=BaseDao.getCon();//第一步 :连接数据库的操作 82 ps=con.prepareStatement(sql);//第二步:预编译 83 //第三步:设置值 84 if(arr!=null && arr.length!=0){ 85 for(int i=0;i<arr.length;i++){ 86 ps.setObject(i+1, arr[i]); 87 } 88 } 89 int count=ps.executeUpdate();//第四步:执行sql语句 90 if(count>0){ 91 return true; 92 }else{ 93 return false; 94 } 95 } catch (ClassNotFoundException e) { 96 // TODO Auto-generated catch block 97 e.printStackTrace(); 98 } catch (SQLException e) { 99 // TODO Auto-generated catch block 100 e.printStackTrace(); 101 } 102 return false; 103 } 104 105 /*public static void main(String[] args) { 106 try { 107 BaseDao.getCon(); 108 System.out.println("测试数据库链接成功"); 109 } catch (ClassNotFoundException e) { 110 // TODO Auto-generated catch block 111 e.printStackTrace(); 112 } catch (SQLException e) { 113 // TODO Auto-generated catch block 114 e.printStackTrace(); 115 } 116 }*/ 117 118 119 }
5:写完工具类BaseDao.java开始写UserDao.java接口和UserDaoImpl.java实现类
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.dao; 2 3 import java.util.List; 4 5 import com.bie.po.User; 6 7 /** 8 * @author BieHongLi 9 * @version 创建时间:2017年2月21日 上午10:38:40 10 * 创建一个接口用于声明用户登陆注册的方法 11 */ 12 public interface UserDao { 13 14 /*** 15 * 用户登陆的方法声明 16 * @param user 17 * @return 18 */ 19 public User login(User user); 20 21 /*** 22 * 用户注册的方法声明 23 * @param user 24 * @return 25 */ 26 public boolean register(User user); 27 28 /*** 29 * 查询用户的信息 30 * @param sql 31 * @param arr 32 * @return 33 */ 34 public List<User> selectUser(String sql,Object[] arr); 35 }
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.dao.impl; 2 3 import java.sql.Connection; 4 import java.sql.PreparedStatement; 5 import java.sql.ResultSet; 6 import java.sql.SQLException; 7 import java.util.ArrayList; 8 import java.util.List; 9 10 import com.bie.dao.UserDao; 11 import com.bie.po.Book; 12 import com.bie.po.User; 13 import com.bie.utils.BaseDao; 14 15 /** 16 * @author BieHongLi 17 * @version 创建时间:2017年2月21日 上午10:38:56 18 * 19 */ 20 public class UserDaoImpl implements UserDao{ 21 22 @Override 23 public User login(User user) { 24 Connection con=null; 25 PreparedStatement ps=null; 26 ResultSet rs=null; 27 try { 28 con=BaseDao.getCon();//1:获取数据库的连接 29 //2:书写sql语句 30 String sql="select * from user where name=? and password=? "; 31 ps=con.prepareStatement(sql);//3:预编译 32 //4:设置值 33 ps.setString(1, user.getName()); 34 ps.setString(2, user.getPassword()); 35 rs=ps.executeQuery();//5:执行sql语句 36 User users=null; 37 if(rs.next()){ 38 users=new User(); 39 //从数据库中获取值设置到实体类的setter方法中 40 users.setId(rs.getInt("id")); 41 users.setName(rs.getString("name")); 42 users.setPassword(rs.getString("password")); 43 users.setEmail(rs.getString("email")); 44 users.setPhone(rs.getString("phone")); 45 46 return user; 47 }else{ 48 return null; 49 } 50 51 } catch (ClassNotFoundException e) { 52 // TODO Auto-generated catch block 53 e.printStackTrace(); 54 } catch (SQLException e) { 55 // TODO Auto-generated catch block 56 e.printStackTrace(); 57 }finally{ 58 //关闭资源,避免出现异常 59 BaseDao.close(con, ps, rs); 60 } 61 return null; 62 } 63 64 /*** 65 * 插入的方法,即注册 66 */ 67 @Override 68 public boolean register(User user) { 69 String sql="insert into user values(0,?,?,?,?) "; 70 List<Object> list=new ArrayList<Object>(); 71 list.add(user.getName()); 72 list.add(user.getPassword()); 73 list.add(user.getEmail()); 74 list.add(user.getPhone()); 75 76 boolean flag=BaseDao.addUpdateDelete(sql,list.toArray()); 77 if(flag){ 78 return true; 79 }else{ 80 return false; 81 } 82 } 83 84 @Override 85 public List<User> selectUser(String sql, Object[] arr) { 86 Connection con=null; 87 PreparedStatement ps=null; 88 ResultSet rs=null; 89 try { 90 con=BaseDao.getCon();//第一步连接数据库 91 ps=con.prepareStatement(sql);//第二步:预编译 92 if(arr!=null){ 93 for(int i=0;i<arr.length;i++){ 94 ps.setObject(i+1, arr[i]); 95 } 96 } 97 //第四步执行sql 98 rs=ps.executeQuery(); 99 List<User> list=new ArrayList<User>(); 100 while(rs.next()){ 101 User user=new User(); 102 user.setId(rs.getInt("id")); 103 user.setName(rs.getString("name")); 104 user.setPassword(rs.getString("password")); 105 user.setEmail(rs.getString("email")); 106 user.setPhone(rs.getString("phone")); 107 //System.out.println(user);//测试数据 108 list.add(user); 109 } 110 return list; 111 } catch (ClassNotFoundException e) { 112 // TODO Auto-generated catch block 113 e.printStackTrace(); 114 } catch (SQLException e) { 115 // TODO Auto-generated catch block 116 e.printStackTrace(); 117 }finally{ 118 //关闭资源,避免出现异常 119 BaseDao.close(con, ps, rs); 120 } 121 122 return null; 123 } 124 125 126 }
6:写完dao层,写service层的接口和实现类
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.service; 2 3 import java.util.List; 4 5 import com.bie.po.User; 6 7 /** 8 * @author BieHongLi 9 * @version 创建时间:2017年2月23日 下午1:58:59 10 * 11 */ 12 public interface UserService { 13 14 /*** 15 * 用户查询的信息 16 * @param user 17 * @return 18 */ 19 public List<User> selectUser(User user); 20 }
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.service.impl; 2 3 import java.util.ArrayList; 4 import java.util.List; 5 6 import com.bie.dao.UserDao; 7 import com.bie.dao.impl.UserDaoImpl; 8 import com.bie.po.User; 9 import com.bie.service.UserService; 10 11 /** 12 * @author BieHongLi 13 * @version 创建时间:2017年2月23日 下午1:59:36 14 * 15 */ 16 public class UserServiceImpl implements UserService{ 17 18 private UserDao dao=new UserDaoImpl(); 19 20 @Override 21 public List<User> selectUser(User user) { 22 //sql语句 23 //String sql="select * from user "; 24 StringBuilder sql=new StringBuilder("select * from user where 1=1 "); 25 List<Object> list=new ArrayList<Object>(); 26 if(user!=null){ 27 //按照姓名查询 28 if(user.getName()!=null && !user.getName().equals("")){ 29 sql.append(" and name = ? "); 30 list.add(user.getName()); 31 } 32 //按照email查询 33 if(user.getEmail()!=null && !user.getEmail().equals("")){ 34 sql.append(" and email = ? "); 35 list.add(user.getEmail()); 36 } 37 38 } 39 return dao.selectUser(sql.toString(), list.toArray()); 40 } 41 42 43 }
7:然后就可以进行登陆了,由于登陆之后显示的是book列表,所以把图书的查询的dao层和service层也列出来
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.dao; 2 3 import java.util.List; 4 5 import com.bie.po.Book; 6 7 /** 8 * @author BieHongLi 9 * @version 创建时间:2017年2月23日 上午10:22:45 10 * 图书信息的接口 11 */ 12 public interface BookDao { 13 14 /*** 15 * 图书信息查询的方法 16 * @param sql 17 * @param arr 18 * @return 19 */ 20 public List<Book> select(String sql,Object[] arr); 21 22 /*** 23 * 获取图书的编号进行查询 24 * @param book 25 * @return 26 */ 27 public Book getBook(Integer id); 28 }
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.dao.impl; 2 3 import java.sql.Connection; 4 import java.sql.PreparedStatement; 5 import java.sql.ResultSet; 6 import java.sql.SQLException; 7 import java.util.ArrayList; 8 import java.util.List; 9 10 import com.bie.dao.BookDao; 11 import com.bie.po.Book; 12 import com.bie.utils.BaseDao; 13 14 /** 15 * @author BieHongLi 16 * @version 创建时间:2017年2月23日 上午10:24:02 17 * 18 */ 19 public class BookDaoImpl implements BookDao{ 20 21 @Override 22 public List<Book> select(String sql, Object[] arr) { 23 Connection con=null; 24 PreparedStatement ps=null; 25 ResultSet rs=null; 26 try { 27 con=BaseDao.getCon();//第一步连接数据库 28 ps=con.prepareStatement(sql);//第二步:预编译 29 if(arr!=null){ 30 for(int i=0;i<arr.length;i++){ 31 ps.setObject(i+1, arr[i]); 32 } 33 } 34 //第四步执行sql 35 rs=ps.executeQuery(); 36 List<Book> list=new ArrayList<Book>(); 37 while(rs.next()){ 38 Book book=new Book(); 39 book.setBookid(rs.getInt("bookid")); 40 book.setBookname(rs.getString("bookname")); 41 book.setPrice(rs.getDouble("price")); 42 book.setAuthor(rs.getString("author")); 43 book.setPic(rs.getString("pic")); 44 book.setPublish(rs.getString("publish")); 45 46 list.add(book); 47 } 48 return list; 49 } catch (ClassNotFoundException e) { 50 // TODO Auto-generated catch block 51 e.printStackTrace(); 52 } catch (SQLException e) { 53 // TODO Auto-generated catch block 54 e.printStackTrace(); 55 }finally{ 56 //关闭资源,避免出现异常 57 BaseDao.close(con, ps, rs); 58 } 59 60 return null; 61 } 62 63 @Override 64 public Book getBook(Integer id) { 65 Connection con=null; 66 PreparedStatement ps=null; 67 ResultSet rs=null; 68 try { 69 con=BaseDao.getCon();//第一步连接数据库 70 String sql="select * from book where bookid = ? "; 71 ps=con.prepareStatement(sql);//第二步:预编译 72 ps.setInt(1, id); 73 74 //第四步执行sql 75 rs=ps.executeQuery(); 76 while(rs.next()){ 77 Book books=new Book(); 78 books.setBookid(rs.getInt("bookid")); 79 books.setBookname(rs.getString("bookname")); 80 books.setPrice(rs.getDouble("price")); 81 books.setAuthor(rs.getString("author")); 82 books.setPic(rs.getString("pic")); 83 books.setPublish(rs.getString("publish")); 84 85 return books; 86 } 87 } catch (ClassNotFoundException e) { 88 // TODO Auto-generated catch block 89 e.printStackTrace(); 90 } catch (SQLException e) { 91 // TODO Auto-generated catch block 92 e.printStackTrace(); 93 }finally{ 94 //关闭资源,避免出现异常 95 BaseDao.close(con, ps, rs); 96 } 97 98 return null; 99 } 100 101 102 }
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.service; 2 3 import java.util.List; 4 5 import com.bie.po.Book; 6 7 /** 8 * @author BieHongLi 9 * @version 创建时间:2017年2月23日 上午10:56:42 10 * 11 */ 12 public interface BookService { 13 14 /*** 15 * 图书信息查询的方法 16 * @return 17 */ 18 public List<Book> select(Book book); 19 20 /*** 21 * 根据id进行查询 22 * @param id 23 * @return 24 */ 25 public Book getBook(Book book); 26 }
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 package com.bie.service.impl; 2 3 import java.util.ArrayList; 4 import java.util.List; 5 6 import com.bie.dao.BookDao; 7 import com.bie.dao.impl.BookDaoImpl; 8 import com.bie.po.Book; 9 import com.bie.service.BookService; 10 11 /** 12 * @author BieHongLi 13 * @version 创建时间:2017年2月23日 上午10:57:01 14 * 15 */ 16 public class BookServiceImpl implements BookService{ 17 18 private BookDao dao=new BookDaoImpl(); 19 20 public List<Book> select(Book book){ 21 //String sql="select * from book "; 22 StringBuilder sql=new StringBuilder("select * from book where 1=1 "); 23 //sql语句 24 List<Object> list=new ArrayList<Object>(); 25 if(book!=null){ 26 27 if(book.getBookid()!=null && book.getBookid()!=0){ 28 sql.append(" and bookid=? "); 29 list.add(book.getBookid()); 30 } 31 /*list.add(book.getBookname()); 32 list.add(book.getPrice()); 33 list.add(book.getAuthor()); 34 list.add(book.getPic()); 35 list.add(book.getPublish());*/ 36 } 37 38 return dao.select(sql.toString(), list.toArray()); 39 } 40 41 @Override 42 public Book getBook(Book book) { 43 if(book.getBookid()!=null && book.getBookid()!=0){ 44 return dao.getBook(book.getBookid()); 45 } 46 return null; 47 } 48 49 }
8:现在展示登陆之后的页面
9:现在展示注册的功能,由于dao层和service层在上面都已经说过了,这里只显示没写的register.jsp页面和doregister.jsp页面
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <% 4 //获取绝对路径路径 ,开发项目一定要使用绝对路径,不然肯定出错 5 String path = request.getContextPath(); 6 String basePath = request.getScheme() + "://" 7 + request.getServerName() + ":" + request.getServerPort() 8 + path + "/"; 9 %> 10 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 11 <html> 12 <head> 13 <base href="<%=basePath %>" /> 14 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 15 <title>注册的页面</title> 16 <style type="text/css"> 17 h1{text-align:center;} 18 h4{text-align:right;color:red;} 19 body{background:url(images/2.png)} 20 </style> 21 22 <script type="text/javascript" src="js/jquery.min.js"></script> 23 <script type="text/javascript"> 24 $(document).ready(function(){ 25 //alert("测试jQuery是否能用"); 26 $("#form1").submit(function(){ 27 var name=$("#name").val();//获取提交的值 28 if(name.length==0){//进行判断,如果获取的值为0那么提示账号不能为空 29 //alert("aa");//测试使用 30 $("#nameError").html("账号不能为空"); 31 return false; 32 } 33 34 //密码进行验证不能为空 35 var password=$("#password").val();//获取提交的密码的值 36 if(password.length==0){ 37 $("#passwordError").html("密码不能为空"); 38 return false; 39 } 40 41 //确认密码进行验证 42 var relpassword=$("#relpassword").val();//获取提交的确认密码的值 43 if(relpassword.length==0){ 44 $("#relpasswordError").html("确认密码不能为空哦"); 45 return false; 46 } 47 48 if(password!=relpassword){ 49 $("#relpasswordError").html("确认密码输入不正确,请重新输入"); 50 return false; 51 } 52 }); 53 54 }); 55 </script> 56 </head> 57 <body> 58 <form action="doregister.jsp" method="post" id="form1"> 59 <h1>用户注册页面</h1> 60 <h4>装饰中......</h4> 61 <hr/> 62 <table align="center"> 63 <tr> 64 <td>账 号:</td> 65 <td> 66 <input type="text" name="name" id="name"/> 67 <div id="nameError" style="display:inline;color:red;"></div> 68 </td> 69 </tr> 70 <tr> 71 <td>密 码:</td> 72 <td> 73 <input type="password" name="password" id="password"> 74 <div id="passwordError" style="display:inline;color:red;"></div> 75 </td> 76 </tr> 77 <tr> 78 <td>确认密码:</td> 79 <td> 80 <input type="password" name="relpassword" id="relpassword"> 81 <div id="relpasswordError" style="display:inline;color:red;"></div> 82 </td> 83 </tr> 84 <tr> 85 <td>电话号码:</td> 86 <td><input type="text" name="phone" id="phone"></td> 87 </tr> 88 <tr> 89 <td>电子邮件:</td> 90 <td><input type="text" name="email" id="email"></td> 91 </tr> 92 <tr> 93 <td colspan="1"> 94 </td> 95 <td> 96 <input type="submit" value="注册"/> 97 <input type="reset" value="重置"/> 98 <a href="login.jsp" target="_blank">登陆</a> 99 </td> 100 </tr> 101 </table> 102 </form> 103 </body> 104 </html>
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@page import="com.bie.dao.impl.UserDaoImpl"%> 2 <%@page import="com.bie.dao.UserDao"%> 3 <%@page import="com.bie.po.User"%> 4 <%@ page language="java" contentType="text/html; charset=UTF-8" 5 pageEncoding="UTF-8"%> 6 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 7 <html> 8 <head> 9 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 10 <title>处理注册的页面</title> 11 </head> 12 <body> 13 <% 14 User user=new User(); 15 //获取login.jsp页面提交的账号和密码 16 String name=request.getParameter("name"); 17 String password=request.getParameter("password"); 18 String email=request.getParameter("email"); 19 String phone=request.getParameter("phone"); 20 21 //获取register.jsp页面提交的账号和密码设置到实体类User中 22 user.setName(name); 23 user.setPassword(password); 24 user.setEmail(email); 25 user.setPhone(phone); 26 27 //引入数据交互层 28 UserDao dao=new UserDaoImpl(); 29 boolean flag=dao.register(user); 30 31 if(flag){ 32 response.sendRedirect("login.jsp"); 33 }else{ 34 response.sendRedirect("register.jsp"); 35 } 36 %> 37 </body> 38 </html>
效果如下所示:
10:找回密码的功能searchPassword.jsp页面和dosearchPassword.jsp和search.jsp页面
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <% 4 //获取绝对路径路径 ,开发项目一定要使用绝对路径,不然肯定出错 5 String path = request.getContextPath(); 6 String basePath = request.getScheme() + "://" 7 + request.getServerName() + ":" + request.getServerPort() 8 + path + "/"; 9 %> 10 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 11 <html> 12 <head> 13 <base href="<%=basePath %>" /> 14 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 15 <title>找回密码</title> 16 <style type="text/css"> 17 body{background:url(images/3.jpg)} 18 </style> 19 </head> 20 <body> 21 <h1>找回密码</h1> 22 <hr/> 23 <a href="javascript: window.history.go(-1)">返回上一级</a> 24 <form action="dosearchPassword.jsp" method="post"> 25 <table> 26 <tr> 27 <td>请输入账号:</td> 28 <td><input type="text" name="name"/></td> 29 </tr> 30 <tr> 31 <td colspan="1"></td> 32 <td> 33 <input type="submit" value="提交"> 34 <input type="reset" value="重置"> 35 </td> 36 </tr> 37 </table> 38 </form> 39 40 </body> 41 </html>
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@page import="java.util.List"%> 2 <%@page import="com.bie.service.impl.UserServiceImpl"%> 3 <%@page import="com.bie.po.User"%> 4 <%@ page language="java" contentType="text/html; charset=UTF-8" 5 pageEncoding="UTF-8"%> 6 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 7 <html> 8 <head> 9 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 10 <title>处理找回密码的页面</title> 11 </head> 12 <body> 13 <% 14 User user=new User(); 15 //获取login.jsp页面提交的账号和密码 16 String name=request.getParameter("name"); 17 user.setName(name); 18 19 UserServiceImpl service=new UserServiceImpl(); 20 List<User> list=service.selectUser(user); 21 request.setAttribute("list", list); 22 for(User u:list){ 23 request.setAttribute("user", u); 24 out.print(u); 25 } 26 if(user!=null){ 27 //response.sendRedirect("search.jsp");//不传输数据的转发 28 request.getRequestDispatcher("search.jsp").forward(request, response); 29 } 30 31 32 %> 33 </body> 34 </html>
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <% 4 //获取绝对路径路径 ,开发项目一定要使用绝对路径,不然肯定出错 5 String path = request.getContextPath(); 6 String basePath = request.getScheme() + "://" 7 + request.getServerName() + ":" + request.getServerPort() 8 + path + "/"; 9 %> 10 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 11 <html> 12 <head> 13 <base href="<%=basePath %>" /> 14 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 15 <title>弹出信息</title> 16 17 18 <script type="text/javascript"> 19 alert("您的密码是:${user.password}"); 20 </script> 21 22 </head> 23 <body style="background-color:pink;"> 24 <h1>您的密码是:${user.password}</h1> 25 <a href="javascript: window.history.go(-1)">返回上一级</a> 26 </body> 27 </html>
效果如下所示:
11:图书列表的功能和图书详情的功能book.jsp页面,doInfo.jsp页面,detail.jsp页面
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8" %> 3 <%@ page import="java.util.List" %> 4 <%@ page import="com.bie.po.Book" %> 5 <%@ page import="com.bie.service.impl.BookServiceImpl" %> 6 7 <%@ include file="head.jsp" %> 8 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 9 <html> 10 <head> 11 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 12 <title>图书处理页面</title> 13 <style type="text/css"> 14 h1{text-align:center;} 15 </style> 16 </head> 17 <body> 18 <% 19 Book book=new Book(); 20 BookServiceImpl service=new BookServiceImpl(); 21 List<Book> list=service.select(book); 22 %> 23 <h1>图书列表</h1> 24 <a href="javascript: window.history.go(-1)">返回上一级</a> 25 <table align="center" cellpadding="10" cellspacing="10"> 26 27 <tr bgcolor="green"> 28 <td>编号</td> 29 <td>书名</td> 30 <td>价格</td> 31 <td>作者</td> 32 <td>封皮</td> 33 <td>出版社</td> 34 </tr> 35 <%-- <% 36 for(Book b:list){ 37 %> --%> 38 <% 39 String bg=""; 40 for(int i=0;i<list.size();i++){ 41 Book b=list.get(i); 42 if(i%2==0) 43 bg="pink"; 44 else 45 bg="yellow"; 46 %> 47 <tr bgcolor="<%=bg%>"> 48 <td><%=b.getBookid() %></td> 49 <td><a href="doInfo.jsp?bookid=<%=b.getBookid() %>"><%=b.getBookname() %></a></td> 50 <td><%=b.getPrice() %></td> 51 <td><%=b.getAuthor() %></td> 52 <td><%=b.getPic() %></td> 53 <td><%=b.getPublish() %></td> 54 </tr> 55 <% 56 } 57 %> 58 59 </table> 60 </body> 61 </html>
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <%@ page import="com.bie.po.Book" %> 4 <%@ page import="com.bie.service.BookService" %> 5 <%@ page import="com.bie.service.impl.BookServiceImpl" %> 6 <% 7 //获取绝对路径路径 ,开发项目一定要使用绝对路径,不然肯定出错 8 String path = request.getContextPath(); 9 String basePath = request.getScheme() + "://" 10 + request.getServerName() + ":" + request.getServerPort() 11 + path + "/"; 12 %> 13 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 14 <html> 15 <head> 16 <base href="<%=basePath %>" /> 17 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 18 <title>书籍详细信息的页面</title> 19 </head> 20 <body> 21 <% 22 Book book=new Book(); 23 String sid=request.getParameter("bookid"); 24 Integer id=Integer.parseInt(sid); 25 BookService service=new BookServiceImpl(); 26 book.setBookid(id); 27 Book books=service.getBook(book); 28 29 session.setAttribute("book", books); 30 response.sendRedirect("detail.jsp"); 31 %> 32 </body> 33 </html>
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <%@ page import="com.bie.po.Book" %> 4 <%@ page import="com.bie.service.BookService" %> 5 <%@ page import="com.bie.service.impl.BookServiceImpl" %> 6 7 <%@ include file="head.jsp" %> 8 <% 9 //获取绝对路径路径 ,开发项目一定要使用绝对路径,不然肯定出错 10 String path = request.getContextPath(); 11 String basePath = request.getScheme() + "://" 12 + request.getServerName() + ":" + request.getServerPort() 13 + path + "/"; 14 %> 15 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 16 <html> 17 <head> 18 <base href="<%=basePath %>" /> 19 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 20 <title>图书详细信息页面</title> 21 22 <style type="text/css"> 23 h1{text-align:center;} 24 a{font-size:24px;text-decoration:none;} 25 a:hover{text-decoration:underline;font-size:28px;} 26 </style> 27 </head> 28 <body> 29 <h1>图书详细信息的页面</h1> 30 <a href="javascript: window.history.go(-1)">返回上一级</a> 31 <% 32 Book book=(Book)session.getAttribute("book"); 33 %> 34 <table align="center" cellpadding="20" cellspacing="20"> 35 <tr> 36 <td>图书编号</td> 37 <td>图书名称</td> 38 <td>图书价格</td> 39 <td>图书作者</td> 40 <td>图书封皮</td> 41 <td>图书出版社</td> 42 </tr> 43 <tr> 44 <td><%=book.getBookid() %></td> 45 <td><%=book.getBookname() %></td> 46 <td><%=book.getPrice() %></td> 47 <td><%=book.getAuthor() %></td> 48 <td><img src="images/<%=book.getPic() %>"></td> 49 <td><%=book.getPublish() %></td> 50 </tr> 51 <tr> 52 <td colspan="3"></td> 53 <td></td> 54 <td colspan="2"></td> 55 </tr> 56 </table> 57 <div style="text-align:center;font-size:36px;"> 58 <a href="doCard.jsp">添加到购物车</a> 59 <a href="book.jsp">图书列表</a> 60 </div> 61 </body> 62 </html>
效果如下所示:
12:页面最上面显示欢迎用户的功能和安全退出的功能logout.jsp和head.jsp
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 4 <html> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 7 <title>退出登陆</title> 8 </head> 9 <body> 10 <% 11 session.invalidate(); 12 response.sendRedirect("login.jsp"); 13 %> 14 </body> 15 </html>
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@page import="com.bie.po.User"%> 2 <%@ page language="java" contentType="text/html; charset=UTF-8" 3 pageEncoding="UTF-8"%> 4 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 5 <html> 6 <head> 7 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 8 <title>头部信息</title> 9 <style type="text/css"> 10 #head{background-color:#eee;height:60px;} 11 a{font-size: 36px;} 12 </style> 13 </head> 14 <body> 15 <% 16 User user=(User)session.getAttribute("user"); 17 if(user==null){ 18 response.sendRedirect("login.jsp"); 19 }else{ 20 %> 21 22 <div id="head"> 23 <table width=100%> 24 <tr> 25 <td>欢迎您 : <%=user.getName() %></td> 26 <td align="right"> 27 <a href="cart.jsp">我的购物车</a> 28 <a href="logout.jsp">安全退出</a> 29 </td> 30 </tr> 31 </table> 32 <%} %> 33 </div> 34 </body> 35 </html>
效果如下所示:
13:购物车功能cart.jsp和添加到购物车doCard.jsp的实现
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@page import="java.util.Set"%> 2 <%@page import="java.util.Map"%> 3 <%@page import="com.bie.po.CardItem"%> 4 <%@ page language="java" contentType="text/html; charset=UTF-8" 5 pageEncoding="UTF-8"%> 6 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 7 <html> 8 <head> 9 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 10 <title>购物车</title> 11 <style type="text/css"> 12 tr,td{text-align:center;background-color:#eee;} 13 14 </style> 15 </head> 16 <body> 17 <table width="100%" align="center"> 18 <tr> 19 <th>书本编号</th> 20 <th>书本名称</th> 21 <th>书本单价</th> 22 <th>书本数量</th> 23 <th>书本小计</th> 24 </tr> 25 <% 26 27 Map<Integer,CardItem> cart=(Map<Integer,CardItem>)session.getAttribute("cart"); 28 29 //Set<Map.Entry<Integer,CardItem>> entrys=cart.entrySet(); 30 //if(entrys==null || entrys.isEmpty()){ 31 //response.sendRedirect("book.jsp"); 32 //} 33 double count=0;//总价格 34 //for(Map.Entry<Integer,CardItem> entry : entrys){ 35 for(Map.Entry<Integer,CardItem> entry : cart.entrySet()){ 36 37 //小计 38 double price=entry.getValue().getNumber() * entry.getValue().getBook().getPrice(); 39 //总价格 40 count=count+price; 41 %> 42 <tr> 43 <td><%=entry.getKey() %></td> 44 <td><%=entry.getValue().getBook().getBookname() %></td> 45 <td><%=entry.getValue().getBook().getPrice()%></td> 46 <td><%=entry.getValue().getNumber() %></td> 47 <td><%=price%></td> 48 </tr> 49 <%} %> 50 <tr> 51 <td colspan="4" align="right">价格总计</td> 52 <td><%=count %></td> 53 </tr> 54 </table> 55 <div style="text-align:right;font-size:36px;margin-top:20px;"> 56 <a href="book.jsp">继续购买图书</a> 57 <a href="login.jsp">登陆页面</a> 58 </div> 59 </body> 60 </html>
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <%@ page import="com.bie.po.Book" %> 4 <%@page import="java.util.HashMap"%> 5 <%@page import="com.bie.po.CardItem"%> 6 <%@page import="java.util.Map"%> 7 8 9 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 10 <html> 11 <head> 12 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 13 <title>处理购物车</title> 14 </head> 15 <body> 16 17 <% 18 //购物车功能 19 //1:我购买的是哪一本书籍,将将要购买的书本先放到session域中 20 Book book=(Book)session.getAttribute("book"); 21 22 //2:如何把该书籍存放到购物车中??? 23 //2.1:先判断是否有购物车,如果没有购物车,那么创建购物车,如果有购物车,则直接使用购物车 24 //2.2:购物车使用什么数据类型? 25 //数组(数组是固定大小的,所以不适合) 26 //List集合(list集合是可以存放相同的对象,所以不适合) 27 //Set集合,Map集合(使用Map集合是因为Map集合存储速度比较快) key:存放商品编号;value:存放购物车项; 28 29 //先将购物车从session中拿出来,然后判断是否存在,不存在就创建。 30 Map<Integer,CardItem> cart=(Map<Integer,CardItem>)session.getAttribute("cart"); 31 //如果没有购物车,只有第一次访问,才会操作 32 if(cart==null){ 33 //就new一个购物车 34 cart=new HashMap<Integer,CardItem>(); 35 } 36 37 //把书籍存放到购物车 38 //第二次判断,判断购物车中是否有该书籍 39 //从购物车中,获取该书籍,如果为空,表示购物车中没有该书籍 40 CardItem item=cart.get(book.getBookid()); 41 if(item==null){//购物车中不存在这本书,创建,数量默认为1 42 item=new CardItem(); 43 item.setBook(book); 44 item.setNumber(1); 45 }else{//购物车中,存在该书籍,直接把数量加1 46 item.setNumber(item.getNumber()+1); 47 } 48 49 50 //把购物车项存放到购物车 51 cart.put(book.getBookid(), item); 52 53 //把购物车存放到session 54 session.setAttribute("cart", cart); 55 56 response.sendRedirect("book.jsp"); 57 %> 58 59 60 </body> 61 </html>
效果如下所示:
基本的功能都已经实现了,权当练习的小项目的,欢迎交流