1 导言
作为一个新手JAVA程序员，我相信很多人和我一样急切的想要寻找项目来做，这里我把马士兵老师讲的JAVA WEB的第一个小项目拿过来给大家分享一下。
首先，对一个项目而言我们先要认识清楚我们要做什么。这里我们要做的是一个模拟的小型BBS，内容分为以下几块：
1、树形展示回帖内容
2.、详细展示帖子内容
3、回复帖子功能
4、管理员登陆功能
5、删除功能
对这个项目而言，我们使用纯JSP最为联系语言，以后使用JSP+JAVABEAN这种主流的方法。纯JSP将事物与展示放在一起做，业务逻辑混乱，但是做一次来培养我们的业务逻辑思考，在这个过程中我们会体会到这种不足，之后自然而然的会投入到JAVABEAN+JSP的怀抱中。
2 数据库分析
作为一个BBS网站，我们主要做的是将数据库中的内容在网页上展示出来，所以我们需要一个良好的数据库作为我们的测试数据。
数据库如下：
create database bbs; use bbs; create table article ( id int primary key auto_increment, pid int, rootid int, title varchar(255), cont text, pdate datetime, isleaf int ); insert into article values (null, 0, 1, '蚂蚁大战大象', '蚂蚁大战大象', now(), 1); insert into article values (null, 1, 1, '大象被打趴下了', '大象被打趴下了',now(), 1); insert into article values (null, 2, 1, '蚂蚁也不好过','蚂蚁也不好过', now(), 0); insert into article values (null, 2, 1, '瞎说', '瞎说', now(), 1); insert into article values (null, 4, 1, '没有瞎说', '没有瞎说', now(), 0); insert into article values (null, 1, 1, '怎么可能', '怎么可能', now(), 1); insert into article values (null, 6, 1, '怎么没有可能', '怎么没有可能', now(), 0); insert into article values (null, 6, 1, '可能性是很大的', '可能性是很大的', now(), 0); insert into article values (null, 2, 1, '大象进医院了', '大象进医院了', now(), 1); insert into article values (null, 9, 1, '护士是蚂蚁', '护士是蚂蚁', now(), 0);
对于BBS中每个帖子的内容，首先我们要有帖子id,他回复的是哪个楼pid，以及主题rootid，回复内容的“主题title+正文cont”，回复日期pdate,是否为叶子节点即是否没有人回复他。对于一个小型测试用数据库已经足够，业务逻辑正确就行，我们不考虑界面美观，毕竟这是我们的练手项目。三 JSP代码
1 树形展示帖子主题
每个bbs都有一个入口界面，BBS入口界面基本上都是以树形展示为主，比如百度贴吧与天涯论坛。代码如下：
<%@ page language="java" contentType="text/html; charset=gbk" pageEncoding="gbk"%> <%@ page import="java.sql.*" %> <%//检查管理员session是否登陆，若登陆显示删除按钮 String admin = (String)session.getAttribute("admin"); if(admin != null && admin.equals("true")) { login = true; } %> <%! String str = "";//全局声明，保存需要打印的字符串，即显示内容 boolean login = false;//默认设为管理员未登录 private void tree(Connection conn, int id, int level) { Statement stmt = null; ResultSet rs = null; String preStr = ""; for(int i=0; i<level; i++) {//层次化结构显示，level为传入参数 preStr += "----"; } try { stmt = conn.createStatement(); String sql = "select * from article where pid = " + id; rs = stmt.executeQuery(sql); String strLogin = ""; while(rs.next()) {//递归查询该节点下是否还有子节点，先打印自己节点，再打印子节点 if(login) { strLogin = "<td><a href='Delete.jsp?id=" + rs.getInt("id") + "&pid=" + rs.getInt("pid") + "'>删除</a>"; }//字符串用于控制是否显示删除按钮 str += "<tr><td>" + rs.getInt("id") + "</td><td>" + preStr + "<a href='ShowArticleDetail.jsp?id=" + rs.getInt("id") + "'>" + rs.getString("title") + "</a></td>" + strLogin + "</td></tr>"; if(rs.getInt("isleaf") != 0) {//如果不是叶子节点，证明还存在子节点，递归打印 tree(conn, rs.getInt("id"), level+1); } } } catch (SQLException e) { e.printStackTrace(); } finally { try { if(rs != null) { rs.close(); rs = null; } if(stmt != null) { stmt.close(); stmt = null; } } catch (SQLException e) { e.printStackTrace(); } } } %> <% Class.forName("com.mysql.jdbc.Driver"); String url = "jdbc:mysql://localhost/bbs?user=root&password=123456"; Connection conn = DriverManager.getConnection(url); Statement stmt = conn.createStatement(); ResultSet rs = stmt.executeQuery("select * from article where pid = 0"); String strLogin = ""; while(rs.next()) { if(login) { strLogin = "<td><a href='Delete.jsp?id=" + rs.getInt("id") + "&pid=" + rs.getInt("pid") + "'>删除</a>"; } str += "<tr><td>" + rs.getInt("id") + "</td><td>" + "<a href='ShowArticleDetail.jsp?id=" + rs.getInt("id") + "'>" + rs.getString("title") + "</a></td>" + strLogin + "</td></tr>"; if(rs.getInt("isleaf") != 0) { tree(conn, rs.getInt("id"), 1); } } rs.close(); stmt.close(); conn.close(); %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> <title>Insert title here</title> </head> <body> <a href="Post.jsp">发表新帖</a> <table border="1"> <%= str %> <% str = ""; //清空str，否则每刷新一次打印一次 login = false;//清空登录位 %> </table> </body> </html>
2 详情页面
在上面的页面中我们加入了查看详情的链接，这里我们写详情链接
<%@ page language="java" contentType="text/html; charset=GB18030" pageEncoding="GB18030"%> <%@ page import="java.sql.*" %> <% String strid = request.getParameter("id");//查看上个页面，我们需要查询的内容传来了id，这里第一步就是接受id int id = Integer.parseInt(strid);//传来的参数默认为字符串，我们转换为int类型，便于sql查询 Class.forName("com.mysql.jdbc.Driver"); String url = "jdbc:mysql://localhost:3306/bbs?user=root&password=123456"; Connection conn = DriverManager.getConnection(url); Statement stmt = conn.createStatement(); ResultSet rs = stmt.executeQuery("select * from article where id = "+ id); %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB18030"> <title>Insert title here</title> </head> <body> <% if(rs.next()){//查询只能拿到一条记录，这里用if就行，用table展示出来 %> <table border="1"> <tr> <td>ID</td> <td><%= rs.getInt("id") %></td> </tr> <tr> <td>Title</td> <td><%= rs.getString("title") %></td> </tr> <tr> <td>Content</td> <td><%= rs.getString("cont") %></td> </tr> </table> <%--加入回复链接，指向回复页面，需要传入参数为，回复楼的id,以及帖子id,这里rootid不是必要参数，加上可以简化流程 --%> <a href="Reply.jsp?id=<%= rs.getInt("id")%>&rootid=<%= rs.getString("rootid")%>">回复</a> <% }//记得打开的东西要逆序关闭 rs.close(); stmt.close(); conn.close(); %> </body> </html>
3 回复页面
<%@ page language="java" contentType="text/html; charset=gbk" pageEncoding="gbk"%> <%//任何情况下都是先接受传递过来的参数 int id = Integer.parseInt(request.getParameter("id")); int rootId = Integer.parseInt(request.getParameter("rootid")); %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> <title>Insert title here</title> <script language="javascript"> <!-- //javascript去空格函数 function LTrim(str){ //去掉字符串 的头空格 var i; for(i=0;i<str.length; i++) { if(str.charAt(i)!=" ") break; } str = str.substring(i,str.length); return str; } function RTrim(str){ var i; for(i=str.length-1;i>=0;i--){ if(str.charAt(i)!=" "&&str.charAt(i)!=" ") break; } str = str.substring(0,i+1); return str; } function Trim(str){ return LTrim(RTrim(str)); } function check() { if(Trim(document.reply.title.value) == "") { alert("please intput the title!"); document.reply.title.focus(); return false; } if(Trim(document.reply.cont.value) == "") { alert("plsease input the content!"); document.reply.cont.focus(); return false; } return true; } --> </script> </head> <body> <form name=reply action="ReplyOK.jsp" method="post" onsubmit="return check()"> <input type="hidden" name="id" value="<%=id %>"> <input type="hidden" name="rootid" value="<%= rootId %>"> <table border="1"> <tr> <td> <input type="text" name="title" size="80"> </td> </tr> <tr> <td> <textarea cols="80" rows="12" name="cont"></textarea> </td> </tr> <tr> <td> <input type="submit" value="提交"> </td> </tr> </table> </form> </body> </html>
4 回复成功，调转显示
任何帖子回复成功后都要进行跳转，否则用户需要手动点击，太不人性化
<%@ page language="java" contentType="text/html; charset=GB18030" pageEncoding="GB18030"%> <%@ page import="java.sql.*" %> <% request.setCharacterEncoding("gbk");//request采用默认编码，我们给他转换成中文编码 int id = Integer.parseInt(request.getParameter("id"));//第一步，接受传递过来的参数 int rootid = Integer.parseInt(request.getParameter("rootid")); String title = request.getParameter("title"); String cont = request.getParameter("cont"); if(title == null) {//虽然前台检查过了，后台仍然要检查 out.println("error! please use my bbs in the right way!"); return; } title = title.trim(); if(title.equals("")) { out.println("title could not be empty!"); return; } cont = cont.trim(); if(cont.equals("")) { out.println("content could not be empty!"); return; } cont = cont.replaceAll(" ", "<br>");//将用户输入域得到的字符串中的回车用html中的换行符替换 Class.forName("com.mysql.jdbc.Driver"); String url = "jdbc:mysql://localhost:3306/bbs?user=root&password=123456"; Connection conn = DriverManager.getConnection(url); conn.setAutoCommit(false);//我们回复过的楼层必然不再是叶子节点，因此这里要用事物处理，关闭自动提交 String sql = "insert into article values(null,?,?,?,?,now(),0)"; PreparedStatement pstmt = conn.prepareStatement(sql);//sql语句过于负责，我们用PreparedStatement进行简便操作 Statement stmt = conn.createStatement(); pstmt.setInt(1,id); pstmt.setInt(2,rootid); pstmt.setString(3, title); pstmt.setString(4, cont); pstmt.executeUpdate(); stmt.executeUpdate("update article set isleaf = 1 where id = "+id); conn.commit(); conn.setAutoCommit(true);//回复自动提交功能 stmt.close(); pstmt.close(); conn.close(); %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB18030"> <title>Insert title here</title> </head> <body> <% response.sendRedirect("ShowArticleTree.jsp");//重定向到入口界面 %> </body> </html>
5 发表新帖
<%@ page language="java" contentType="text/html; charset=gbk" pageEncoding="gbk"%> <%@ page import="java.sql.*" %> <% request.setCharacterEncoding("gbk"); String action = request.getParameter("action");//接受传递给自己的参数 if(action != null && action.equals("post")) { String title = request.getParameter("title"); String cont = request.getParameter("cont"); cont = cont.replaceAll(" " , "<br>");//将回车符换为html重的换行符 Class.forName("com.mysql.jdbc.Driver"); String url = "jdbc:mysql://localhost/bbs?user=root&password=123456"; Connection conn = DriverManager.getConnection(url); conn.setAutoCommit(false); String sql = "insert into article values (null, 0, ?, ?, ?, now(), 0)"; PreparedStatement pstmt = conn.prepareStatement(sql, Statement.RETURN_GENERATED_KEYS); Statement stmt = conn.createStatement(); pstmt.setInt(1, -1); pstmt.setString(2, title); pstmt.setString(3, cont); pstmt.executeUpdate(); ResultSet rsKey = pstmt.getGeneratedKeys(); rsKey.next(); int key = rsKey.getInt(1); rsKey.close(); stmt.executeUpdate("update article set rootid = " + key + " where id = " + key); conn.commit(); conn.setAutoCommit(true); stmt.close(); pstmt.close(); conn.close(); response.sendRedirect("ShowArticleFlat.jsp");//重定向到平面显示 } %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> <title>Insert title here</title> </head> <body> <form action="Post.jsp" method="post"> <input type="hidden" name="action" value="post"> <table border="1"> <tr> <td> <input type="text" name="title" size="80"> </td> </tr> <tr> <td> <textarea cols="80" rows="12" name="cont"></textarea> </td> </tr> <tr> <td> <input type="submit" value="提交"> </td> </tr> </table> </form> </body> </html>
6 删除功能
<%@ page language="java" contentType="text/html; charset=GB18030" pageEncoding="GB18030"%> <%@ page import="java.sql.*" %> <%!//递归判断该id下面是否有子结点，有的话递归，最后删除自己 private void del(Connection conn,int id){ Statement stmt = null; ResultSet rs = null; try{ stmt = conn.createStatement(); String sql = "select * from article where pid = "+ id;//查询该id下的所有内容，因此该id应作为pid查询 rs = stmt.executeQuery(sql); while(rs.next()){//查询到的结果集进行一条一条循环迭代 del(conn,rs.getInt("id")); } stmt.executeUpdate("delete from article where id = " + id); } catch(SQLException e){ e.printStackTrace(); } finally{ try{ if(rs != null){//注意异常的捕获，这样处理更加严谨 rs.close(); rs = null; } if(stmt != null){ stmt.close(); stmt = null; } } catch(SQLException e){ e.printStackTrace(); } } } %> <% String admin = (String)session.getAttribute("admin"); if(admin == null || !admin.equals("true")) { out.println("孙贼，别想找BUG来删除！"); return; } %> <% int id = Integer.parseInt(request.getParameter("id"));//第一步，接受传递过来的参数 int pid = Integer.parseInt(request.getParameter("pid"));//第一步，接受传递过来的参数 Class.forName("com.mysql.jdbc.Driver"); String url = "jdbc:mysql://localhost:3306/bbs?user=root&password=123456"; Connection conn = DriverManager.getConnection(url); conn.setAutoCommit(false);//我们回复过的楼层必然不再是叶子节点，因此这里要用事物处理，关闭自动提交 del(conn,id); Statement stmt = conn.createStatement(); ResultSet rs = stmt.executeQuery("select count(*) from article where pid = " + pid); rs.next(); int count = rs.getInt(1); rs.close(); stmt.close(); if (count <= 0){ Statement stmtUpdate = conn.createStatement(); stmtUpdate.executeUpdate("update article set isleaf = 0 where id = " + pid); stmtUpdate.close(); } conn.commit(); conn.setAutoCommit(true);//回复自动提交功能 conn.close(); %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB18030"> <title>Insert title here</title> </head> <body> <% response.sendRedirect("ShowArticleTree.jsp");//重定向到入口界面 %> </body> </html>
7 登陆页面
登陆页面主要有美工来做，这里的代码主要看业务逻辑
<%@ page contentType="text/html; charset=gbk" pageEncoding="gbk" %> <% String action = request.getParameter("action"); if(action != null && action.equals("login")) { String username = request.getParameter("uname"); String password = request.getParameter("pwd"); if(username == null || !username.equals("admin")) { %> <font color="white" size=5>username not correct!</font> <% //return; }else if(password == null || !password.equals("admin")) { out.println("password not correct!"); //return; }else { session.setAttribute("admin", "true"); response.sendRedirect("ShowArticleTree.jsp"); } } %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <!-- saved from url=(0054)http://www.simworld.com/client_access/client_login.asp --> <HTML><HEAD><TITLE>SIM - Client Access - Login</TITLE> <META http-equiv=Content-Type content="text/html; charset=gbk" pageEncoding="gbk"><LINK href="images/sim_stylesheet.css" type=text/css rel=styleSheet> <SCRIPT language=JavaScript src="" type=text/javascript></SCRIPT> <SCRIPT language=JavaScript src="" type=text/javascript></SCRIPT> <SCRIPT language=JavaScript src="" type=text/javascript></SCRIPT> <META content="MSHTML 6.00.2900.2963" name=GENERATOR> <style type="text/css"> <!-- .STYLE1 {color: #CCCCCC} --> </style> </HEAD> <BODY bgColor=#20355a leftMargin=0 topMargin=0 onload=init() marginheight="0" marginwidth="0"><!--Begin all TOP NAVIGATIOND ROPDOWN LAYERS ------------><!--Begin About Sim Dropdown 1 --> <DIV id=about_sim_drop1> <TABLE cellSpacing=0 cellPadding=0 width=140 border=0> <TBODY> <TR> <TD bgColor=#ffffff> <TABLE cellSpacing=2 cellPadding=2 width=140 border=0> <TBODY> <TR> <TD vAlign=top align=left width=130><A class=topnav onmouseover="stopTime(); showLayer('about_sim_corporate_drop2'); hideLayer('about_sim_portfolio_drop2');" onmouseout=startTime(); href="http://www.simworld.com/about_sim/corporate/index.asp">Corporate Info</A></TD> <TD vAlign=top width=10><IMG height=10 alt=arrow src="images/nav_arrows.gif" width=10></TD></TR></TBODY></TABLE></TD></TR><!-- <tr> <td bgcolor="#CACFDA"> <table width="140" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="130" valign="top" align="left"><a href="/about_sim/services/index.asp" onMouseOver="stopTime(); hideLayer('about_sim_corporate_drop2');" onMouseOut="startTime();" class="topnav">Services</a></td> <td width="10" valign="top"><img src="/pics/spacer.gif" alt="" width="10" height="10"></td> </tr> </table> </td> </tr> --> <TR> <TD bgColor=#cacfda> <TABLE cellSpacing=2 cellPadding=2 width=140 border=0> <TBODY> <TR> <TD vAlign=top align=left width=130><A class=topnav onmouseover="stopTime(); hideLayer('about_sim_corporate_drop2');" onmouseout=startTime(); href="http://www.simworld.com/about_sim/products/index.asp">Products</A></TD> <TD vAlign=top width=10><IMG height=10 alt="" src="images/spacer.gif" width=10></TD></TR></TBODY></TABLE></TD></TR><!--<tr> <td bgcolor="#CACFDA"> <table width="140" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="130" valign="top" align="left"><a href="/about_sim/portfolio/index1.asp" onMouseOver="stopTime(); showLayer('about_sim_portfolio_drop2'); hideLayer('about_sim_corporate_drop2');" onMouseOut="startTime();" class="topnav">Portfolio</a></td> <td width="10" valign="top"><img src="/pics/nav_arrows.gif" alt="arrow" width="10" height="10"></td> </tr> </table> </td> </tr>--> <TR> <TD bgColor=#ffffff> <TABLE cellSpacing=2 cellPadding=2 width=140 border=0> <TBODY> <TR> <TD vAlign=top align=left width=130><A class=topnav onmouseover=stopTime(); onmouseout="startTime(); hideLayer('about_sim_corporate_drop2');" href="http://www.simworld.com/about_sim/portfolio/index_temp.asp">Portfolio</A></TD> <TD vAlign=top width=10><IMG height=10 alt=arrow src="images/spacer.gif" width=10></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV><!-- End About Sim Dropdown 1 --><!--Begin About Sim Corporate Dropdown 2 --> <DIV id=about_sim_corporate_drop2> <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TBODY> <TR> <TD bgColor=#cacfda> <TABLE cellSpacing=2 cellPadding=2 width="100%" border=0> <TBODY> <TR> <TD vAlign=top align=left width="100%"><A class=topnav onmouseover=stopTime(); onmouseout=startTime(); href="http://www.simworld.com/about_sim/corporate/mission.asp">Mission</A></TD></TR></TBODY></TABLE></TD></TR> <TR> <TD bgColor=#ffffff> <TABLE cellSpacing=2 cellPadding=2 width="100%" border=0> <TBODY> <TR> <TD vAlign=top align=left width="100%"><A class=topnav onmouseover=stopTime(); onmouseout=startTime(); href="http://www.simworld.com/about_sim/corporate/philosophy.asp">Philosophy</A></TD></TR></TBODY></TABLE></TD></TR> <TR> <TD bgColor=#cacfda> <TABLE cellSpacing=2 cellPadding=2 width="100%" border=0> <TBODY> <TR> <TD vAlign=top align=left width="100%"><A class=topnav onmouseover=stopTime(); onmouseout=startTime(); href="http://www.simworld.com/about_sim/corporate/team.asp">Team</A></TD></TR></TBODY></TABLE></TD></TR> <TR> <TD bgColor=#ffffff> <TABLE cellSpacing=2 cellPadding=2 width="100%" border=0> <TBODY> <TR> <TD vAlign=top align=left width="100%"><A class=topnav onmouseover=stopTime(); onmouseout=startTime(); href="http://www.simworld.com/about_sim/corporate/specialty.asp">Specialty Markets </A></TD></TR></TBODY></TABLE></TD></TR> <TR> <TD bgColor=#cacfda> <TABLE cellSpacing=2 cellPadding=2 width="100%" border=0> <TBODY> <TR> <TD vAlign=top align=left width="100%"><A class=topnav onmouseover=stopTime(); onmouseout=startTime(); href="http://www.simworld.com/about_sim/corporate/news.asp">News & Awards</A></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV><!--Begin About Sim Corporate Dropdown 2 --><!--Begin About Sim Portfolio Dropdown 2 --> <DIV id=about_sim_portfolio_drop2><!--<table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td bgcolor="#CACFDA"> <table width="100%" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="100%" valign="top" align="left"><a href="/about_sim/portfolio/websites.asp" onMouseOver="stopTime();" onMouseOut="startTime();" class="topnav">Websites</a></td> </tr> </table> </td> </tr> <tr> <td bgcolor="#FFFFFF"> <table width="100%" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="100%" valign="top" align="left"><a href="/about_sim/portfolio/multimedia.asp" onMouseOver="stopTime();" onMouseOut="startTime();" class="topnav">Multimedia Presentations</a></td> </tr> </table> </td> </tr> <tr> <td bgcolor="#CACFDA"> <table width="100%" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="100%" valign="top" align="left"><a href="/about_sim/portfolio/print_graphic_design.asp" onMouseOver="stopTime();" onMouseOut="startTime();" class="topnav" target="_blank">Print / Graphic Design</a></td> </tr> </table> </td> </tr> <tr> <td bgcolor="#FFFFFF"> <table width="100%" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="100%" valign="top" align="left"><a href="/about_sim/client_list.pdf" onMouseOver="stopTime();" onMouseOut="startTime();" class="topnav" target=_"blank">Client List (PDF)</a></td> </tr> </table> </td> </tr> </table>--></DIV><!--Begin About Sim Portfolio Dropdown 2 --><!--Begin Client Access Dropdown 1 --> <DIV id=client_access_drop1><!--<table width="140" border="0" cellspacing="0" cellpadding="0"> <tr> <td bgcolor="#FFFFFF"> <table width="140" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="130" valign="top" align="left"><a href="/client_access/client_login.asp" onMouseOver="stopTime(); hideLayer('client_access_customer_drop2');" onMouseOut="startTime();" class="topnav">Client Login</a></td> <td width="10" valign="top"><img src="/pics/spacer.gif" alt="" width="10" height="10"></td> </tr> </table> </td> </tr> <tr> <td bgcolor="#CACFDA"> <table width="140" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="130" valign="top" align="left"><a href="/client_access/customerservice/index1.asp" onMouseOver="stopTime(); showLayer('client_access_customer_drop2');" onMouseOut="startTime();" class="topnav">Customer Service</a></td> <td width="10" valign="top"><img src="/pics/nav_arrows.gif" alt="arrow" width="10" height="10"></td> </tr> </table> </td> </tr> <tr> <td bgcolor="#FFFFFF"> <table width="140" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="130" valign="top" align="left"><a href="/under_construction.asp" onMouseOver="stopTime(); hideLayer('client_access_customer_drop2');" onMouseOut="startTime();" class="topnav">Beyond Today</a></td> <td width="10" valign="top"><img src="/pics/spacer.gif" alt="" width="10" height="10"></td> </tr> </table> </td> </tr> </table>--></DIV><!-- End Client Access Dropdown 1 --><!--Begin Client Access Customer Service Dropdown 2 --> <DIV id=client_access_customer_drop2><!--<table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td bgcolor="#CACFDA"> <table width="100%" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="100%" valign="top" align="left"><a href="/client_access/customerservice/policy1.asp" onMouseOver="stopTime();" onMouseOut="startTime();" class="topnav">Our Policy</a></td> </tr> </table> </td> </tr> <tr> <td bgcolor="#FFFFFF"> <table width="100%" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="100%" valign="top" align="left"><a href="/client_access/customerservice/help1.asp" onMouseOver="stopTime();" onMouseOut="startTime();" class="topnav">Help</a></td> </tr> </table> </td> </tr> <tr> <td bgcolor="#CACFDA"> <table width="100%" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="100%" valign="top" align="left"><a href="/client_access/customerservice/downloads1.asp" onMouseOver="stopTime();" onMouseOut="startTime();" class="topnav">Downloads</a></td> </tr> </table> </td> </tr> <tr> <td bgcolor="#FFFFFF"> <table width="100%" border="0" cellspacing="2" cellpadding="2"> <tr> <td width="100%" valign="top" align="left"><a href="/client_access/customerservice/tech_standards1.asp" onMouseOver="stopTime();" onMouseOut="startTime();" class="topnav" target=_"blank">Technical Standards</a></td> </tr> </table> </td> </tr> </table>--></DIV><!-- End Client Access Customer Service Dropdown 2 --><!--Begin Join our Team Dropdown 1 --> <DIV id=join_our_team_drop1> <TABLE cellSpacing=0 cellPadding=0 width=150 border=0> <TBODY> <TR> <TD bgColor=#ffffff> <TABLE cellSpacing=2 cellPadding=2 width=150 border=0> <TBODY> <TR> <TD vAlign=top width=10><IMG height=10 alt="" src="images/client_access.htm" width=10></TD> <TD vAlign=top align=right width=140><A class=topnav onmouseover=stopTime(); onmouseout=startTime(); href="http://www.simworld.com/join_our_team/job_openings.asp">Job Openings</A></TD></TR></TBODY></TABLE></TD></TR> <TR> <TD bgColor=#cacfda> <TABLE cellSpacing=2 cellPadding=2 width=150 border=0> <TBODY> <TR> <TD vAlign=top width=10><IMG height=10 alt="" src="images/spacer.gif" width=10></TD> <TD vAlign=top align=right width=140><A class=topnav onmouseover=stopTime(); onmouseout=startTime(); href="http://www.simworld.com/join_our_team/apply_online.asp">Employee Benefits</A></TD></TR></TBODY></TABLE></TD></TR> <TR> <TD bgColor=#ffffff> <TABLE cellSpacing=2 cellPadding=2 width=150 border=0> <TBODY> <TR> <TD vAlign=top width=10><IMG height=10 alt="" src="images/spacer.gif" width=10></TD> <TD vAlign=top align=right width=140><A class=topnav onmouseover=stopTime(); onmouseout=startTime(); href="http://www.simworld.com/join_our_team/corp_culture.asp">Corporate Culture</A></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV><!-- End Join Our Team Dropdown 1 --><!--End all TOP NAVIGATIOND ROPDOWN LAYERS ------------><!--Begin Browser Spanning Table, this allows Main Web Site Table to be centered in the middle of the browser --> <TABLE height="100%" cellSpacing=0 cellPadding=0 width="100%" align=center border=0> <TBODY> <TR> <TD><!--Begin Main Web Site Table All Website Design elements below--> <TABLE borderColor=#ffffff cellSpacing=0 cellPadding=0 width=760 align=center border=1> <TBODY> <TR> <TD> <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TBODY> <TR> <TD><!-- Begin Top Logo, Navigation and Message bar Table --> <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0><!--Beign Global Nav Buttons ---> <TBODY> <TR> <TD rowSpan=2><IMG height=53 alt="Screened Images Multimedia" src="images/sim_logo_top.gif" width=136 useMap=#top_logo_map border=0><MAP name=top_logo_map><AREA shape=RECT alt="Screened Images Multimedia [Back to Home]" coords=11,4,120,54 href="http://www.simworld.com/index.asp"></MAP></TD> <TD><span class="STYLE1">欢迎来到 著名的BBS后台</span></TD> </TR> <TR><!--End Global Nav Buttons ---> <TD><span class="STYLE1">不输入用户名密码不许进 用户名: admin 密码: admin </span></TD> </TR></TBODY></TABLE><!-- End Top Logo, Navigation and Message bar Table --></TD></TR> <TR> <TD><!-- Begin Inner Content Table: This portion will be customizable throughout the website --> <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TBODY> <TR> <TD><IMG height=324 alt="" src="images/client_login_left_arc.gif" width=137 useMap=#bot_logo_map border=0><MAP name=bot_logo_map><AREA shape=RECT alt="Screened Images Multimedia [Back to Home]" coords=11,0,120,24 href="http://www.simworld.com/index.asp"></MAP></TD> <TD> <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TBODY> <TR> <TD><IMG height=91 alt="CLIENT LOG-IN" src="images/client_login_title.gif" width=282></TD></TR> <TR> <TD> <FORM action=Login.jsp method=post> <input type=hidden name=action value=login> <TABLE cellSpacing=0 cellPadding=0 width="100%" background="images/client_login_text_bg.gif" border=0> <TBODY> <TR> <TD rowSpan=4><IMG height=158 alt="" src="images/spacer.gif" width=22 border=0></TD> <TD colSpan=2> <P class=bodydarkblue>Please enter your username and password here to preview your designs, check project status and/or submit new job requests.</P></TD></TR> <TR> <TD> <P class=bodyldarkblue><LABEL for=uname>用户名:</LABEL></P></TD> <TD><INPUT id=uname name=uname></TD></TR> <TR> <TD> <P class=bodyldarkblue><LABEL for=pwd>密码:</LABEL></P></TD> <TD><INPUT id=pwd type=password name=pwd></TD></TR> <TR> <TD vAlign=top colSpan=2><A class=bodydarkblue href="http://www.simworld.com/client_access/client_login.asp"><STRONG><!--Forget your password?--></STRONG></A><IMG height=1 alt="" src="images/spacer.gif" width=132 border=0> <INPUT type=image alt=Submit src="images/client_login_submit.gif" align=absMiddle value=Submit name=Submit></TD></TR></TBODY></TABLE></TD></TR> <TR> <TD><IMG height=75 alt="" src="images/client_login_bot_arc.gif" width=282></TD></TR></TBODY></TABLE></TD> <TD><IMG height=324 alt="Log-in Image" src="images/client_login_main_pic.jpg" width=341></TD></TR></TBODY></TABLE><!-- End Inner Content Table --------></TD></TR> <TR> <TD><!-- Begin Bottom Navigation: Contact Us, Request A- Quote --> <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TBODY> <TR> <TD><A onmouseover="Rollover('nav_homepage_a','nav_homepage');" onmouseout="Rollover('nav_homepage','nav_homepage');" href="http://www.simworld.com/index.asp"></A><IMG height=26 alt="" src="images/interior_bot_nav_bar.gif" width=100%></TD> </TR> <TR> <TD><IMG height=12 alt="Copyright 2003 Screened Images, Inc." src="images/bot_footer_bar.gif" width=760></TD></TR></TBODY></TABLE><!-- End Bottom Navigation: Contact Us, Request A- Quote --></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE><!--End Main Web Site Table --></TD></TR></TBODY></TABLE><!--End Browser Spanning Table --></BODY></HTML>
8 平面展示
<%@ page language="java" contentType="text/html; charset=gbk" pageEncoding="gbk"%> <%@ page import="java.sql.*"%> <% int pageSize = 3;//定义一页显示多少条数据 String strPageNo = request.getParameter("pageNo");//接受当前页数 int pageNo; if (strPageNo == null || strPageNo.equals("")) { pageNo = 1;//若没有则默认第一页 } else { try { pageNo = Integer.parseInt(strPageNo.trim()); } catch (NumberFormatException e) { pageNo = 1; } if (pageNo <= 0)//不合法页默认第一页 pageNo = 1; } Class.forName("com.mysql.jdbc.Driver"); String url = "jdbc:mysql://localhost/bbs?user=root&password=123456"; Connection conn = DriverManager.getConnection(url); Statement stmtCount = conn.createStatement(); ResultSet rsCount = stmtCount .executeQuery("select count(*) from article where pid = 0");//拿出父亲节点为0的，即主题帖 rsCount.next(); int totalRecords = rsCount.getInt(1); int totalPages = totalRecords % pageSize == 0 ? totalRecords / pageSize : totalRecords / pageSize + 1;//若可以整除则显示多少页，否则+1页 if (pageNo > totalPages) pageNo = totalPages;//指定最多页数不可溢出 int startPos = (pageNo - 1) * pageSize;//确定mysql中要取出来的数据位置 Statement stmt = conn.createStatement(); ResultSet rs = stmt .executeQuery("select * from article where pid = 0 order by pdate desc limit " + startPos + "," + pageSize);//利用mysql中的分页来显示 %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> <title>Insert title here</title> </head> <body> <a href="Post.jsp">发表新帖</a> <table border="1"> <% while (rs.next()) { %> <tr> <td><%=rs.getString("title")%></td> </tr> <% } rs.close(); stmt.close(); conn.close(); %> </table> 共<%=totalPages%>页 第<%=pageNo%>页 <a href="ShowArticleFlat.jsp?pageNo=<%=pageNo-1%>"> < </a> <%--传递给本页要显示的页数 --%> <a href="ShowArticleFlat.jsp?pageNo=<%=pageNo+1%>"> > </a> <form name="form1" action="ShowArticleFlat.jsp"><%--动态提交数据--%> <select name="pageNo" onchange="document.form1.submit()"> <% for(int i=1; i<=totalPages; i++) { %> <option value=<%=i%> <%=(pageNo == i) ? "selected" : ""%>> 第<%=i%>页 <% } %> </select> </form> <form name="fom2" action="ShowArticleFlat.jsp"> <input type=text size=4 name="pageNo" value=<%=pageNo%> /> <input type="submit" value="go" /> </form> </body> </html>
3 总结
到此为止，一个纯JSP的BBS完成，大家应该感觉到了头绪有点乱的感觉，正是由于这种感觉，我们之后会采取jsp+javabean的方法来开发，那样代码逻辑性看上去会强很多。
给大家一个建议：这些代码都是先写出来功能模块，能够独立运行以后才慢慢加入其他控制模块以及健壮性模块，所以按照这个顺序写还是没那么困难的，希望大家都能够学好JAVA WEB！