軟件實訓:手把手寫一個簡單的javaweb項目

前言:

三個星期的實訓過去了大半,剩下的時間要開始搞實訓項目,所以花點時間整理一下實訓的收穫。感謝何老師,講得簡練清晰,引人入勝。感謝相遇。

開發環境:

IDE:Eclipse IDEA
JDK:JDK8
DB:MySql5.5
服務器:tomcat-7
瀏覽器:谷歌chrom

實現功能:

1.用戶登陸,通過查詢數據庫中是否含有該用戶實現登陸;
在這裏插入圖片描述
2.用戶註冊,通過向數據庫的表中添加用戶信息進行註冊;
在這裏插入圖片描述
3.優質用戶推薦,通過查詢數據庫表中的標識recommend判斷是否顯示在優質用戶欄;
在這裏插入圖片描述
4.管理員賬戶admin可實現用戶的信息過濾及查看詳細信息、修改用戶和刪除用戶;
在這裏插入圖片描述
5.用戶註銷。

詳細設計:

1.數據庫的建立及jdbc的封裝;
①:user表:

在這裏插入圖片描述
hid爲主鍵;recommend默認爲0,等於1時爲優質用戶;flag默認爲0,等於1時爲用戶被刪除。

②:jdbc的封裝:

參考博客:https://blog.csdn.net/weixin_43912621/article/details/106871762.

2.Eclipse上配置tomcat;

參考博客: https://blog.csdn.net/weixin_43912621/article/details/107041596.大體記錄了一下過程。

3.jsp:

導包jjstl.jar和standard.jar;

4.目錄結構介紹:

在這裏插入圖片描述

①:bean爲封裝的用戶類,封裝了用戶的所有信息:
package bean;

public class User {

	private int hid;
    private String name;
    private String password;
    private int age;
    private String email;
    private String Picture;
    private String intro;
    private int recommend;
    private int flag;
    private int toage;
    
    public int getHid() {
		return hid;
	}

	public String getPicture() {
		return Picture;
	}

	public void setPicture(String picture) {
		Picture = picture;
	}

	public void setHid(int hid) {
		this.hid = hid;
	}

	public String getIntro() {
		return intro;
	}

	public void setIntro(String intro) {
		this.intro = intro;
	}

	public int getRecommend() {
		return recommend;
	}

	public void setRecommend(int recommend) {
		this.recommend = recommend;
	}

	public int getFlag() {
		return flag;
	}

	public void setFlag(int flag) {
		this.flag = flag;
	}

	public User() {
    	
    }
    
	public User(int uid, String name, String picture,String intro) {
		this.hid = uid;
		this.name = name;
		this.Picture = picture;
		this.intro = intro;
	}
	
	public int getToage() {
		return toage;
	}

	public void setToage(int toage) {
		this.toage = toage;
	}

	public User(int uid, String name, int age,int toage,int recommend) {
		this.hid = uid;
		this.name = name;
		this.age = age;
		this.toage = toage;
		this.recommend = recommend;
	}
	
	
	public User(int uid, String name, int age,String email,int recommend) {
		this.hid = uid;
		this.name = name;
		this.age = age;
		this.email = email;
		this.recommend = recommend;
	}
	
	public User(int uid, String name, String password, int age, String email,String picture,String intro,int recommend,int flag) {
		this.hid = uid;
		this.name = name;
		this.password = password;
		this.age = age;
		this.email = email;
		this.Picture = picture;
		this.intro = intro;
		this.recommend = recommend;
		this.flag = flag;
	}

	public int getUid() {
		return hid;
	}
	public void setUid(int uid) {
		this.hid = uid;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String getPassword() {
		return password;
	}
	public void setPassword(String password) {
		this.password = password;
	}
	public int getAge() {
		return age;
	}
	public void setAge(int age) {
		this.age = age;
	}
	public String getEmail() {
		return email;
	}
	public void setEmail(String email) {
		this.email = email;
	}
	
	public String toString() {
		return name+"\t"+age+"\t"+email;
	}
}

②:control爲servlet包:servlet是作爲來自 Web 瀏覽器或其他 HTTP 客戶端的請求和 HTTP 服務器上的數據庫或應用程序之間的中間層。
③:dao包用來與數據庫進行業務操作,返回業務操作結果;
package dao.Impl;

import bean.User;
import dao.IUserDao;
import util.DBconUtil;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.List;


public class IUserDaoImpl implements IUserDao {

	public int register(User user) {
		// TODO Auto-generated method stub
		int i = 0;
		Connection conn = DBconUtil.getConn();
		PreparedStatement pstmt = null;
		String sql = "insert into users(name,password,age,email,picture,intro,recommend,flag)values(?,?,?,?,?,?,?,?)";
		try {

			//new Driver();
			//Class c = Driver.class;
			conn = DBconUtil.getConn();
			
			pstmt = conn.prepareStatement(sql);
	
			System.out.println("DB"+user.getName());
			pstmt.setString(1,user.getName());
			pstmt.setString(2,user.getPassword());
			pstmt.setInt(3,user.getAge());
			pstmt.setString(4,user.getEmail());
			pstmt.setString(5,user.getPicture());
			pstmt.setString(6,user.getEmail());
			pstmt.setInt(7,user.getRecommend());
			pstmt.setInt(8,user.getFlag());
			
			i = pstmt.executeUpdate();
			
		} catch(Exception e) {
			e.printStackTrace();
		}finally {

			DBconUtil.close(null,pstmt,null,null);
		}
		return i;
	}

	public int login(User user) {
		// TODO Auto-generated method stub
		int hid = 0;
		ResultSet rs = null;
		Connection conn = DBconUtil.getConn();
		PreparedStatement pstmt = null;
		String sql = "select hid from users where name =? and password = ?";
		try {

			conn = DBconUtil.getConn();
			
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1,user.getName());
			pstmt.setString(2,user.getPassword());
			
			rs = pstmt.executeQuery();
			if(rs.next()) {
				hid = rs.getInt("hid");
			}
			
		} catch(Exception e) {
			e.printStackTrace();
		}finally {

			DBconUtil.close(null,pstmt,null,rs);
		}
		return hid;
	}

	public List<User> getIndexUser(){
		
		String sql = "select hid,name,picture,intro from users where recommend = 1";
		ResultSet rs = null;
		Connection conn = DBconUtil.getConn();
		PreparedStatement pstmt = null;
		List<User> list = null;
		try {

			conn = DBconUtil.getConn();
			
			pstmt = conn.prepareStatement(sql);
			list = new ArrayList<User>();
			rs = pstmt.executeQuery();
			while(rs.next()) {
				int hid = rs.getInt("hid");
				String name = rs.getString("name");
				String picture = rs.getString("picture");
				String intro = rs.getString("intro");
				User user = new User(hid,name,picture,intro);
				list.add(user);
			}
			
		} catch(Exception e) {
			e.printStackTrace();
		}finally {
			DBconUtil.close(null,pstmt,null,rs);
		}
		return list;
		
	}

	public List<User> getAllUser(User user) {
		String sql = "select hid,name,age,email,recommend from users where 1=1 and flag=0";
		Connection conn = DBconUtil.getConn();
		StringBuffer sb = new StringBuffer(sql);
		List<Object> params = new ArrayList<Object>();
		if(null != user.getName() && !"".equals(user.getName())) {
			sb.append(" and name like ? ");
			params.add("%"+user.getName()+"%");
		}
		if(user.getRecommend()!=2) {
			sb.append(" and recommend = ? ");
			params.add(user.getRecommend());
		}
		if(0 != user.getAge()) {
			sb.append(" and age>= ? ");
			params.add(user.getAge());
		}
		if(0 != user.getToage()) {
			sb.append(" and age<= ? ");
			params.add(user.getToage());
		}
		sql=sb.toString();
		//System.out.println(sql);
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		List<User> list = null;
		try {
			pstmt = conn.prepareStatement(sql);
			
			for(int i=0;i<params.size();i++) {
				pstmt.setObject(i+1, params.get(i));
			}
			
			rs = pstmt.executeQuery();
			list = new ArrayList<User>();
			
			while(rs.next()) {
			    int uid = rs.getInt("hid");
			    String name = rs.getString("name");
			    int age = rs.getInt("age");
			    String email = rs.getString("email");
			    int recommend = rs.getInt("recommend");
			    
			    User user_ = new User(uid,name,age,email,recommend);
			    list.add(user_);
			}
		} catch (SQLException e) {
			e.printStackTrace();
		}finally {
			DBconUtil.close(null, pstmt, null, rs);
		}
		return list;
	}

	public User getUserById(int uid) {
		String sql = "select name,password,age,email,picture,intro,recommend from users where hid = ?";
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		Connection conn = DBconUtil.getConn();
		User user = null;
		try {
			pstmt = conn.prepareStatement(sql);
			pstmt.setInt(1, uid);
			rs = pstmt.executeQuery();
			if(rs.next()) {
			    String name = rs.getString("name");
			    String password = rs.getString("password");
			    int age = rs.getInt("age");
			    String email = rs.getString("email");
			    String intro = rs.getString("intro");
			    String picture = rs.getString("picture");
			    int recommend = rs.getInt("recommend");
			    user = new User(uid,name,password,age,email,picture,intro,recommend,0);
			}
		} catch (SQLException e) {
			e.printStackTrace();
		}finally {
			DBconUtil.close(null, pstmt, null, rs);
		}
		System.out.println(user);
		return user;
	}
	
	public int updateUser(User user) {
		String sql="update users set age=?,email=?,recommend=?,intro=? where hid = ?";
		Connection conn = DBconUtil.getConn();
		int i = 0;
		System.out.println("dao-------------"+user.getEmail());
		PreparedStatement pstmt = null;
		try {
			pstmt = conn.prepareStatement(sql);
			pstmt.setInt(1, user.getAge());
			pstmt.setString(2, user.getEmail());
			pstmt.setInt(3, user.getRecommend());
			pstmt.setString(4, user.getIntro());
			pstmt.setInt(5, user.getUid());
			System.out.println("dao-------------"+user.getEmail());
			i = pstmt.executeUpdate();
		} catch (SQLException e) {
			e.printStackTrace();
		}finally {
			DBconUtil.close(null, pstmt, null, null);
		}
		return i;
	}
	
	public int deleteUserById(int uid) {
		String sql="delete from users where hid = ?";
		Connection conn = DBconUtil.getConn();
		int i = 0;
		PreparedStatement pstmt = null;
		try {
			pstmt = conn.prepareStatement(sql);
			pstmt.setInt(1, uid);
			
			i = pstmt.executeUpdate();
		} catch (SQLException e) {
			e.printStackTrace();
		}finally {
			DBconUtil.close(null, pstmt, null, null);
		}
		return i;
	}
	
	public int updateUserById(int uid,int flag) {
		String sql="update users set flag = ? where hid = ?";
		Connection conn = DBconUtil.getConn();
		int i = 0;
		PreparedStatement pstmt = null;
		try {
			pstmt = conn.prepareStatement(sql);
			pstmt.setInt(1, flag);
			pstmt.setInt(2, uid);
			
			i = pstmt.executeUpdate();
		} catch (SQLException e) {
			e.printStackTrace();
		}finally {
			DBconUtil.close(null, pstmt, null, null);
		}
		return i;
	}
}
④:service包用來接收dao包業務操作後的結果,傳給control包;
package service.Impl;

import java.util.List;

import bean.User;
import dao.IUserDao;
import dao.Impl.IUserDaoImpl;
import service.IUserServices;

public class IUserServicesImpl implements IUserServices {

	private IUserDao iuserDao = new IUserDaoImpl();
	
	public boolean register(User user) {
		
		int i = iuserDao.register(user);
		return i>0?true:false;
	}

	public boolean login(User user) {
		// TODO Auto-generated method stub
		int hid = iuserDao.login(user);
		return hid>0?true:false;
	}


	public List<User> getIndexUser() {
		List<User> list = iuserDao.getIndexUser();
		if(null == list || list.size() == 0) {
			return null;
		}
		return list;
		
	}

	public List<User> getAllUser(User user) {
		List<User> list = iuserDao.getAllUser(user);
		if(null == list || list.size() == 0) {
			return null;
		}
		return list;
	}
	
	public User getUserById(int uid) {
		User user = iuserDao.getUserById(uid);
		return user;
	}
	
	public boolean updateUser(User user) {
		int i = iuserDao.updateUser(user);
		return i>0?true:false;
	}
	
	public boolean deleteUserById(int uid) {
		int i = iuserDao.deleteUserById(uid);
		return i>0?true:false;
	}
	
	public boolean updateUserById(int uid,int flag) {
		int i = iuserDao.updateUserById(uid,flag);
		return i>0?true:false;
	}
}

⑤:util爲封裝的jdbc工具包,用來進行數據庫的業務操作。
4.登錄:

前端頁面login.jsp:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>登錄</title>
	<link rel ="stylesheet" type="text/css" href="./bootstrap-3.3.7-dist/css/bootstrap.css">
	<script type = "text/javascript" href="./js/jquery.js"></script>
	<script type = "text/javascript" href="./bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
</head>
<body>
	<div class="container">
		<!--hearder-->
		<jsp:include page="header.jsp"></jsp:include>
		
		<h3 class="text-center">用戶登錄</h3>
		<span style="margin-left: 290px;color:red;">${info }</span>
		<form class="form-horizontal" style="padding-left:150px;" role="form" action="login.do" method="post">
			<div class="form-group">
				<label for="user" class="col-sm-2 control-label">用戶名</label>
				<div class="col-sm-6">
					<input type="text" name="user" class="form-control" id="user" placeholder="請輸入用戶名">
				</div>
			</div>

			<div class="form-group">
				<label for="password" class="col-sm-2 control-label">密碼</label>
				<div class="col-sm-6">
					<input type="password" name="password" class="form-control" id="password" placeholder="請輸入密碼">
				</div>
			</div>

			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="submit" class="btn btn-info">登錄</button>
				</div>
			</div>
		</form>
			
	</div>
</body>
</html>

header.jsp爲上方導航欄:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Insert title here</title>
	
</head>
<style type="text/css">
	body{padding-top:70px}
</style>
<body>
	<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
	    <div class="container-fluid">
	    <div class="navbar-header">
	        <img src="./images/logo.jpg" style="margin-top:2px" width="120" height="45">
	    </div>
	    <div>
	    
	    	<p class="navbar-text navbar-left">
	        	<c:if test="${name!=null }">
				
	        		歡迎:${name }${info }&nbsp;&nbsp;
		        	<a href="index.do">首頁</a>&nbsp;&nbsp;
		        	<a href="#">個人資料</a>&nbsp;&nbsp;

				</c:if>
				
				<c:if test="${name==null }">
			        	<a href="login.jsp">登錄</a>&nbsp;&nbsp;
			        	<a href="register.jsp">註冊</a>&nbsp;&nbsp;
			        	<a href="index.do">首頁</a>&nbsp;&nbsp;
				</c:if>
				
				<c:if test="${name == 'admin'}">
						<a href="userindex.do">用戶管理</a>
				</c:if>
		    </p>
			
	        
	        <p class="navbar-text navbar-right" style="margin-right:2px">
	        	<a href-"">消息<span class="badge" style="background-color:#f00;margin-top:-2px">42</span></a>&nbsp;&nbsp;
	        	<a href="loginout.do" style="">註銷</a>
	        </p>
	    </div>
	    </div>
	</nav>
</body>
</html>

登錄的action=“login.do”,login.do通過獲取login.jsp中輸入的用戶名和密碼,判斷是否登陸成功。

package control;

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 bean.User;
import service.IUserServices;
import service.Impl.IUserServicesImpl;

/**
 * Servlet implementation class LoginServlet
 */
@WebServlet("/login.do")
public class LoginServlet extends HttpServlet {
	private IUserServices iuserServices = new IUserServicesImpl();
	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doPost(req,resp);
	}
	@Override
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		request.setCharacterEncoding("UTF-8");//編碼方式
		String name = request.getParameter("user");//獲取前端輸入的用戶名
		String password = request.getParameter("password");//獲取前端輸入的密碼
		
		//封裝爲User類
		User user = new User();
		user.setName(name);
		user.setPassword(password);
		
		
		boolean result = iuserServices.login(user);//判斷是否登錄成功
		
		if(result) {
			request.getSession().setAttribute("name",name);//若成功傳參name到header.jsp  用來歡迎  
			response.sendRedirect("index.do");
		}else {
			request.setAttribute("info", "用戶名或密碼錯誤");
			request.getRequestDispatcher("login.do").forward(request, response);
		}
	}
}

5.用戶管理:

只用管理員admin才能進行用戶管理,header.jsp這裏:

<c:if test="${name == 'admin'}">
	<a href="userindex.do">用戶管理</a>
</c:if>

那麼userindex.do通過輸入條件進行查詢,如果不輸入即輸出表中的全部內容。:

package control;

import java.io.IOException;
import java.util.List;

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 bean.User;
import service.IUserServices;
import service.Impl.IUserServicesImpl;

/**
 * Servlet implementation class UserIndexServlet
 */
@WebServlet("/userindex.do")
public class UserIndexServlet extends HttpServlet {
	private IUserServices iuserServices = new IUserServicesImpl();
	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		// TODO Auto-generated method stub
		doPost(req,resp);
	}
	@Override
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		request.setCharacterEncoding("UTF-8");
		String name = request.getParameter("user");
		String recommend = request.getParameter("recommend");
		String age = request.getParameter("age");
		String toage = request.getParameter("toage");
		if(null == age || "".equals(age)) {
			age = "0";
		}
		if(null == toage || "".equals(toage)) {
			toage = "0";
		}
		if(null == recommend || "".equals(recommend)) {
			recommend = "2";
		}
		User user = new User(0,name,Integer.parseInt(age),Integer.parseInt(toage),Integer.parseInt(recommend));
		
		List<User> list = iuserServices.getAllUser(user);
		request.setAttribute("list", list);
		request.setAttribute("user", user);
		request.getRequestDispatcher("/userIndex.jsp").forward(request, response);
	}
}

前端頁面:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>用戶管理</title>
	<link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css">
		<script src="js/jquery-1.11.1.js"></script>
		<script src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>

	<script type="text/javascript">
			//toastr.options = {"timeOut":1000};
			var uid = 0;
			var trobj;
			$(function(){
				/*
					當點擊確認刪除時:
					        獲取當前uid
					    Ajax調用servlet刪除記錄
					        根據刪除結果提示用戶
				*/
				$("#ok").click(function(){
					$("#myModal").modal('hide');
					$.ajax({
						url:"userdelete.do",
						type:"post",
						dataType:"json",
						async:true,
						data:"uid="+uid,
						success:function(data){
							if(data==1){
								// 隱藏當前行
								trobj.hide();
								//toastr.success("刪除成功!");
							}else{
								//toastr.success("刪除失敗!");
							}
						}
					})
				})
			})
			
			function showd(uid_,obj){
				// 橋接對象
				uid = uid_;
				trobj = $(obj).parent().parent();
				$('#myModal').modal("show");
			}
		</script>
</head>
<body>
	<div class="container">
		<!--hearder-->
		<jsp:include page="header.jsp"></jsp:include>

		<h3>用戶列表</h3>
		<form class="form-horizontal" style="margin-left: -140px;margin-top:40px; ">
			<div class="form-group">
				<label for="user" class="col-sm-2 control-label">用戶名:</label>
				<div class="col-sm-2">
					<input type="text" name="user" class="form-control" value="${user.name }" id="user" placeholder="請輸入用戶名">
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-2 control-label">&nbsp;&nbsp;&nbsp;薦:</label>
					<input name="recommend" type="radio" value="2" ${user.recommend==2?"checked":"" } ${user.name==null?"checked":"" } style="margin:10px 13px 0px;">全部
					<input name="recommend" type="radio" value="1" ${user.recommend==1?"checked":"" } style="margin:10px 13px 0px;">已推薦
					<input name="recommend" type="radio" value="0" ${user.recommend==0?"checked":"" } style="margin:10px 13px 0px;">未推薦
			</div>
			
			<!--如何讓兩個input並排顯示?用.form-inline-->
			<div class="form-group">
				<label for="age" class="col-sm-2 control-label">&nbsp;&nbsp;&nbsp;齡:</label>
				<div class="col-sm-2 form-inline">
					<input type="text" name="age" value="${user.age==0?'':user.age }" class="form-control" id="age" placeholder="">
				</div>
				<!-- width可以覆蓋掉掉col-sm-2 的設定-->
				<label for="toage" class="col-sm-2 control-label" style="width: 0px;margin-left: 20px;">TO</label>
				<div class="col-sm-2 form-inline">
					<input type="text" name="toage" value="${user.toage==0?'':user.toage }" class="form-control" id="toage" placeholder="">
				</div>
			</div>
			
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="submit" class="btn btn-sm btn-info">查詢</button>
				</div>
			</div>
		</form>
		
		
		<table class="table table-hover" style="margin-top: 70px;">
			<caption>查詢結果:</caption>
			<thead>
				<tr>
					<th>用戶名</th>
					<th>年齡</th>
					<th>郵箱</th>
					<th>是否推薦</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody>
			<c:forEach items="${list }" var="user">
				<tr>
					<td>${user.name }</td>
					<td>${user.age }</td>
					<td>${user.email }</td>
					<td>${user.recommend==1?"已推薦":"未推薦" }</td>
					<td>
						<a href="userinfo.do?hid=${user.hid }&flag=0" class="btn btn-primary btn-xs">查看</a>
						<a href="userinfo.do?hid=${user.hid }&flag=1" class="btn btn-warning btn-xs">修改</a>
						<button type="button" class="btn btn-danger btn-xs" onclick="showd(${user.hid},this)">刪除 </button>
					</td>
				</tr>
			</c:forEach>
			<c:if test="${empty list }">
				<tr><td colspan="5" class="text-center">此查詢無數據!</td></tr>
			</c:if>
			</tbody>
		</table>
	</div>
	
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog">
		  <div class="modal-dialog" role="document">
		    <div class="modal-content">
		      <div class="modal-header">
		        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
		        <h4 class="modal-title">提示:</h4>
		      </div>
		      <div class="modal-body">
		        <p>是否確認刪除?</p>
		      </div>
		      <div class="modal-footer">
		        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
		        <button type="button" id="ok" class="btn btn-primary">確認</button>
		      </div>
		    </div><!-- /.modal-content -->
		  </div><!-- /.modal-dialog -->
		</div><!-- /.modal -->
</body>
</html>

每一個用戶會有三個按鍵,各自實現不同的功能:

<a href="userinfo.do?hid=${user.hid }&flag=0" class="btn btn-primary btn-xs">查看</a>
<a href="userinfo.do?hid=${user.hid }&flag=1" class="btn btn-warning btn-xs">修改</a>
<button type="button" class="btn btn-danger btn-xs" onclick="showd(${user.hid},this)">刪除 </button>

拿刪除來說,點擊後會彈出:
在這裏插入圖片描述
點擊確認後,js中進行userdelete.do。功能就介紹這兩個,其他的大致相仿,優質用戶推薦就是取出recommend等於1的用戶展示出來。源碼請參考https://download.csdn.net/download/weixin_43912621/12567991
.

後記:

記錄一下小插曲:
1.刪除的提示一直不彈出,找陳大佬一起改了一下午,最後是jq的路徑搞錯了,我········;當然,輪播圖不輪播也是這個問題。
2.亂碼,修改數據庫中表的內容時,中文亂碼,一步一步定位,最後定位到數據庫這裏,只需要改一句jdbc:mysql://127.0.0.1:3306/數據庫名?useUnicode=true&characterEncoding=utf8。
3.醉裏挑燈看劍,夢迴吹角連營。八百里分麾下炙,五十弦翻塞外聲,沙場秋點兵。
馬作的盧飛快,弓如霹靂弦驚。了卻君王天下事,贏得生前身後名。可憐白髮生!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章