下载文档原格式
javascript实现简单留⾔板案例⽤Javascript实现留⾔板案例（附带删除留⾔），供⼤家参考，具体内容如下正在学习⼤前端中，有代码和思路不规范不正确的地⽅往多多包涵，感谢指教在⼀些⽹站的讨论品论区，我们通常可以看见会有留⾔板这个功能，然后当⽤户评论时，空评论不能评论，发布的评论将会最新显⽰，把旧的评论抵下去，然后博主可以对评论进⾏删除代码如下：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title><style>* {margin: 0;padding: 0;}body {padding: 100px;}textarea {width: 200px;height: 100px;border: 1px solid pink;outline: none;resize: none;}ul {margin-top: 50px;}li {list-style: none;width: 300px;padding: 5px;background-color: rgb(245, 209, 243);color: red;font-size: 14px;margin: 15px 0;}li a {float: right;text-decoration: none;}</style></head><body><textarea name="" id=""></textarea><button>发布</button><ul></ul><script>var btn=document.querySelector('button')var textarea=document.querySelector('textarea')var ul=document.querySelector('ul')btn.onclick=function () {if (textarea.value==''){alert('宁没有输⼊内容')return false}else{var li=document.createElement('li')li.innerHTML=textarea.value+"<a href='javascript:;'>删除</a>"ul.insertBefore(li,ul.children[0])var as=document.querySelectorAll('a')for (var i=0;i<as.length;i++){as[i].onclick=function () {ul.removeChild(this.parentNode) }}}}</script></body></html>效果展⽰空评论时：新的评论会把旧评论抵下去：删除时：代码解释这⾥就是当按钮点击事件触发时，获取⽂本域⾥⾯的内容，触发函数，先进⾏判断，判断⽂本域的值是否为空，如果是，那么弹出警⽰框，并且不将⽂本的内容显⽰在下⾯。
关于留言板js课程设计一、课程目标知识目标：1. 学生能够理解留言板的基本原理，掌握JavaScript（JS）语言在网页中的应用；2. 学生能够运用HTML和CSS知识，结合JS实现留言板的动态交互功能；3. 学生了解并能使用JS数组、对象等数据结构存储和管理留言数据。
技能目标：1. 学生能够运用所学知识，独立编写并调试简单的JS代码，实现留言板的增删改查功能；2. 学生能够运用事件处理机制，实现用户与留言板之间的交互；3. 学生能够通过本课程的学习，提高解决问题的能力和编程实践能力。
情感态度价值观目标：1. 学生培养对编程的兴趣和热情，增强对计算机科学的认识和好奇心；2. 学生在学习过程中，培养团队协作和沟通能力，学会分享和借鉴他人的经验；3. 学生通过编程实践，培养创新思维和动手能力，提高自信心和成就感。
本课程针对高年级学生，结合学科特点和教学要求，将目标分解为具体的学习成果。
通过本课程的学习，使学生能够掌握JavaScript编程基础，实现留言板功能，并在实践中培养编程兴趣和团队协作能力。
教学过程中，注重知识传授与实践操作相结合，以提高学生的综合素养。
二、教学内容1. 留言板功能需求分析- 了解留言板的基本功能，如发表留言、查看留言、删除留言等；- 分析留言板涉及的前端技术，包括HTML、CSS和JavaScript。
2. JavaScript基础知识回顾- 变量、数据类型、运算符；- 控制结构（条件语句、循环语句）；- 函数定义与调用；- 事件处理机制。
3. 留言板核心功能实现- 使用HTML和CSS搭建留言板界面；- 使用JavaScript实现留言的发表、删除功能；- 使用JavaScript数组存储和管理留言数据；- 实现留言的动态展示。
4. 留言板高级功能拓展- 使用JavaScript对象存储留言信息；- 实现留言的编辑功能；- 添加时间戳显示留言时间；- 留言排序和分页功能。
初级前端开发实训创建一个基本的留言板功能初级前端开发实训 - 创建一个基本的留言板功能在本次的初级前端开发实训中，我们将要创建一个基本的留言板功能。
留言板是一个常见的应用，它允许用户发布留言、查看留言并与其他用户进行互动。
为了实现这一功能，我们将使用HTML、CSS和JavaScript来构建前端界面，并使用后端技术来处理数据和实现服务器端功能。
一、准备工作在开始之前，我们需要做一些准备工作。
首先，确保你已经安装了适当的开发工具，比如文本编辑器和浏览器。
其次，我们需要创建所需的文件和目录结构。
创建一个名为"messageboard"的文件夹，并在其中创建三个文件夹分别命名为"css"、"js"和"images"。
此外，我们还需要创建一个名为"index.html"的HTML文件，一个名为"style.css"的CSS 文件，以及一个名为"script.js"的JavaScript文件。
二、构建前端界面接下来，我们将从构建前端界面开始。
打开"index.html"文件，并按照下面的示例代码来编写HTML结构：```html<!DOCTYPE html><html><head><title>留言板</title><link rel="stylesheet" type="text/css" href="css/style.css"></head><body><h1>欢迎来到留言板</h1><div id="message-container"><h2>留言列表</h2><ul id="message-list"><!-- 这里将来会动态生成留言 --></ul></div><div id="message-form"><h2>发布留言</h2><input type="text" id="name-input" placeholder="请输入您的用户名"><textarea id="message-input" placeholder="请输入留言内容"></textarea><button id="submit-button">发布</button></div><script src="js/script.js"></script></body></html>```以上代码中，我们创建了一个简单的留言板界面。
一个简单的留言板代码<!DOCTYPE html><html><head><meta charset='utf-8'></head><body><h1>留言板</h1><!--以下为读取留言要用的 PHP 代码 --><?php// 连接数据库$conn = mysqli_connect('ip地址', '用户名', '密码', '数据库名')or die('连接数据库失败：' . mysqli_error());// 设置数据库字符集mysqli_query($conn, 'SET NAMES UTF8');// 执行查询$sql = 'SELECT * FROM message ORDER BY created_at ASC'; // 查询语句$result = mysqli_query($conn, $sql) or die('查询数据失败：' . mysqli_error($conn));// 输出数据if (mysqli_num_rows($result) > 0) {// 输出每行数据while ($row = mysqli_fetch_assoc($result)) {echo '<div>';echo '<h3>' . $row['name'] . ' 发表于 ' . $row['created_at'] . '</h3>';echo '<p>' . $row['content'] . '</p >';echo '</div>';}} else {echo '暂无留言！';}// 关闭数据库mysqli_close($conn);><!-- 以上为读取留言结束 --><!-- 以下为发表留言 --><form action="index.php" method="POST"><div><label for="name">昵称：</label><input type="text" name="name"></div><div><label for="content">内容：</label> <textarea name="content"></textarea> </div><input type="submit" value="提交"></form><!-- 以上为发表留言结束 --></body></html>。
1、使用application对象的num属性来保存目前发表留言的总数，用application对象的三组属性autn、titn、artn（n=1、
2、3….）来保存所有用户发表的每一篇留言的作者、题目和留言内容。
2、liuyan1.jsp：
文件开头的一段JSP代码判断是否刚开始建立application对象，即判断application对象的num属性值是否为空（null）。
如果是，则设这个属性值为0，从而保证了application对象的num值在以后的页面中不为空。
3、liuyan2.jsp：
当作者添加完内容并单击“添加到留言板”按钮时，内容被提交到liuyan2.jsp。
liuyan2.jsp 首先通过request对象得到用户添加的内容，如果用户添加的内容不全，则给出信息“不添加作者、标题和内容，留言失败！”，此时不做任何处理，留言添加没有成功。
只有用户添加信息符合要求，程序将给application对象的num属性加1，同时把用户添加的留言作者、标题和内容赋给application对象的属性autn、titn、artn（n=1、2、3….n的值为num中保存的数值）中去。
4、liuyan3.jsp：
liuyan3.jsp程序首先使用getAttribute方法获取application对象的num属性的值，即获取到留言总数值，然后根据这个数值建立循环，从application对象的三组属性中提出每个留言的作者、标题和内容，生成表格打印这些留言。
admin_index.jsp11．<%@page contentType="text/html;charset=gb2312"%>22．<%@ page import="java.sql.*,javax.sql.*,javax.naming.*" %>33．44．<%55．String admin=(String)session.getAttribute("admin");66．if(admin==null || !admin.equals("true"))77．{88．out.println("你无权访问这个页面!!!");99．return;1010．}1111．%>1212．<html>1313．<head>1414．<title>网上书店留言板</title>1515．</head>1616．<body>1717．<a href="../say.html">我要留言</a><br>1818．<%1919．Context ctx=new InitialContext();2020．DataSource ds=(DataSource)ctx.lookup("java:comp/env/jdbc/ 21bookstore");2221．Connection conn=ds.getConnection();2322．2423．//创建可滚动的结果集。
2524．Statement stmt=conn.createStatement(2625．ResultSet.TYPE_SCROLL_INSENSITIVE,2726．ResultSet.CONCUR_READ_ONLY);2827．ResultSet rs=stmt.executeQuery("select * from guestbook 29order by gst_time desc");3028．3129．//移动游标至结果集的最后一行3230．st();3331．3432．//得到当前行的行数，也就得到了数据库中留言的总数3533．int rowCount=rs.getRow();3634．if(rowCount==0)3735．{3836．out.println("当前没有任何留言!");3937．return;4038．}4139．4240．String strCurPage=request.getParameter("page");4341．4442．//表示当前的页数4543．int curPage;4644．4745．if(strCurPage==null)4846．curPage=1;4947．else5048．curPage=Integer.parseInt(strCurPage);5149．5250．//定义每页显示的留言数5351．int countPerPage=5;5452．5553．//计算所有留言显示需要的总页数5654．int pageCount=(rowCount+countPerPage-1)/countPerPage; 5755．5856．//移动游标至结果集中指定的行。
ASP最简单的留言本一、建立文件！最简单的论坛也要有几个必要的文件，就是：1、数据库，用来储存发表的帖子！-------命名为：bbs.mdb2、有数据库就必须连接数据库，该文件用来连接数据库：----命名为：conn.asp3、发表帖子的文件----命名为：say.asp4、保存发表帖子内容的文件-----命名为：save.asp5、显示帖子标题的文件------命名为：index.asp6、显示帖子内容的文件，即点击标题后所进入的页面-----命名为：show.asp建立文件是可以先建立文本文档，他的格式为"文件名.txt"，我们只需把它改为"文件名.asp"注：一定要用双引号，不然建立出来的文件还说txt 后缀的二、各文件的主要内容1、bbs.mdb打开这个数据库，就是Access建立一个表，命名为bbs该表中有几个字段:id(自动给帖子编号)，他的数据类型设为“自动编号”name(用来储存发表的作者)，数据类型为“文本”title(用来储存帖子的主题)，数据类型为“文本”body(用来储存帖子的内容)，数据类型为“备注”2、conn.asp源代码为：<%Server.scriptTimeout="10"connstr="DBQ="+server.mappath("bbs.mdb")+";D efaultDir=;DRIVER={Microsoft Access Driver (*.mdb)};"setconn=Server.CreateObject("ADODB.connection") conn.open connstr%>这个文件也没有什么好说的，就是建立和数据库文件的连接，"bbs.mdb"就是我们刚才建立的数据库文件3、say.asp源代码为：<form method="POST" action="save.asp"><p>大名：<input type="text" name="name" size="20"></p><p>标题：<input type="text" name="title" size="91"></p><p>内容：</p><p><textarea rows="11" name="body" cols="97"></textarea></p><p> </p><p><input type="submit" value="提交" name="B1"><input type="reset" value="重置" name="B2"></p></form>大家应该看得懂的，这个根本就是html语法，对的，根本就是，这个只是发表的界面不过要注意这一句<form method="POST" action="save.asp">，他把用户所填的内容发送至save.asp这个文件，下面就看save.asp这个文件吧！4、save.asp源代码：<!--#include file="conn.asp"--><%name=Replace(Request.Form("name"),"'","''" )title=Replace(Request.Form("title"),"'","''" )body=Replace(Request.Form("body"),"'","''") %><%if name="" or title="" or body="" then%> 请<a href="****:history.go(-1)">后退</a>填写完整资料，你才能发表帖子！<%else%><%set savebbs=conn.execute("insert into bbs(name,title,body)values('"&name&"','"&title&"','"&body&"')")%>发表成功！<a href="index.asp">查看帖子</a> <%end ifset savebbs=nothing%>第一句：<!--#include file="conn.asp"-->，意思是插入conn.asp文件，即与数据库进行连接！asp语句必须用<% %>这个格式包含起来，而插入文件的语句就不用，接下来几句：name=Replace(Request.Form("name"),"'","''") title=Replace(Request.Form("title"),"'","''" )body=Replace(Request.Form("body"),"'","''") “Replace(Request.Form("name"),"'","''")”意思是接收表单中名为name的文本框发来的数据，而“name=Replace(Request.Form("name"),"'","''" )”则是把发来的数据储存在name变量中，如果你这样：“abc123=Replace(Request.Form("name"),"'","' '")”就是把表单中名为name的文本框发来的数据储存在abc123变量中接着：if name="" or title="" or body="" then 判断name、title和body变量中是否没有填写内容，即为""，如果这样，就执行这一语句：“请<a href="****:history.go(-1)">后退</a>填写完整资料，你才能发表帖子！”该语句属于html语法，大家都看得懂的！"<%else%>"就是说“当if……then不成立（即是说所有内容都已经填写）”，就执行语句：“<%set savebbs=conn.execute("insert into bbs(name,title,body)values('"&name&"','"&title&"','"&body&"')")% >发表成功！<a href="index.asp">查看帖子</a>”"set save=conn.execute"属于固定的语句，不过savebbs可以自己修改,"="后面的就难解释了：insert into bbs(name,title,body)意思是向名为bbs的表（在建立数据库时已经建立的表）中的name,title,body字段插入，插入什么呢？看接下的values('"&name&"','"&title&"','"&body&"')") values是“值”的意思就是插入向量name,title,body，向量用格式'"&name&"'表示最后：end if就是结束if……thenset savebbs=nothing可以说是关闭掉：set savebbs=conn.execute("insert into bbs(name,title,body)values('"&name&"','"&title&"','"&body&"')")5、index.asp源代码：<!--#include file="conn.asp"--><b><a href="say.asp">发表帖子</a></b><br><br> <div align="center"><center><table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; " bordercolor="#000000" width="100%" height="26"><tr><td width="17%"><b>作者</b></td><td width="83%"><b>主题</b></td></tr></table></center></div><hr size="1"><%i=1set showbbs=conn.execute("select*from bbs order by id desc")do while not showbbs.eof%><div align="center"><center><table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; " bordercolor="#000000" width="100%" height="20"><tr><td width="17%"><%=showbbs("name")%> </td> <td width="83%"><ahref="show.asp?id=<%=showbbs("id")%>"><%=sho wbbs("title")%></a></td></tr></table></center></div><hr size="1"><%i=i+1if i>50 then exit doshowbbs.movenextLoopshowbbs.Closeset showbbs=nothing%>主要讲精华部分：set showbbs=conn.execute("select*from bbs order by id desc")意思是：向数据库中的bbs数据表查询数据，并以id排顺序，还有这么一句：<%=showbbs("name")%>就是显示数据表中的name字段的数据，这里的showbbs就是set showbbs=……中的showbbs代码中的i=1和i=i+1if i>50 then exit do showbbs.movenextLoopshowbbs.Closeset showbbs=nothing这几句属于循环语句,这里就不理他，理解了也不太好用，因为他只显示50张贴子！if i>50 then exit do中的50可以修改但我们做论坛必须把帖子分页，又因为分页这个语句太复杂，我想就不讲了，等这一个弄懂了才来弄还有一句很有用的：<ahref="show.asp?id=<%=showbbs("id")%>"><%=sho wbbs("title")%></a>里面的超连接：show.asp?id=<%=showbbs("id")%>，注意：这里的超连接把帖子的id包含了，等一下在show.asp文件中就有用了6、show.asp源代码：<!--#include file="conn.asp"--><%id=request.querystring("id")%><%set show=conn.execute("select*from bbs where id="&id&"")%><a href="index.asp"><b>回到首页</b></a><br><b><a href="say.asp">发表帖子</a></b><br><hr size="1"><table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" height="180"><tr><td width="21%" height="22"><b>作者：</b><%=show("name")%></td><td width="79%" height="22"><b>主题：</b><%=show("title")%></td></tr><tr><td width="100%" colspan="2" height="158" valign="top"><b><br>内容：</b><%=show("body")%></td></tr></table><%set show=nothing%>劲语句---精华语句：id=request.querystring("id")在讲解index.asp文件的后面已经说到：show.asp?id=<%=showbbs("id")这一句，id=request.querystring("id")就是把地址栏中的id的值读取下来，因为index.asp文件中的超连接点击后，地址栏就为http://…………/show.asp?id=数字，所以show.asp使用id=request.querystring("id")语句把数字读取下来于是接着使用：set show=conn.execute("select*from bbs where id="&id&"")向数据表查询id为这时读取下来的数字的帖子，即where id="&id&"最后<%set show=nothing%>三、一个简单的论坛就这样完成了，挂在我们自己的ASP空间上去试试还有就是所有的文件在同一个目录中。
jsp⽤application对象制作留⾔板1 <%@ page contentType="text/html; charset=gb2312"%>2 <html>3 <body>4 <form action="show.jsp" method="post">5输⼊名字：<input type="text" name="name"><br> 留⾔标题：<input6 type="text" name="title"><br> 留⾔:<br>7 <textarea rows="10" cols="30" name="text" wrap="physical"></textarea>8 <br> <input type="submit" value="提交"><br>9 </form>10 <form action="chuli.jsp" method="get">11 <input type="submit" name="look" value="查看留⾔板"><br>12 </form>131415 </body>16 </html><%@ page contentType="text/html; charset=gb2312"%><%@page import="java.util.Vector"%><%@ page import="java.util. *"%><%request.setCharacterEncoding("gb2312");String name = request.getParameter("name");String title = request.getParameter("title");String text = request.getParameter("text");if (name == null || name.length() == 0)name = "";if (title == null || title.length() == 0)title = "";if (text == null || text.length() == 0)text = "";String s = name + "#" + title + "#" + text;add(s);%><%!Vector vector = new Vector();ServletContext application;//有些服务器不直接⽀持application对象，//必须⽤ServletContext 类类声明这个对象，//再使⽤getServletContext⽅法//对application对象初始化int i = 0;synchronized void add(String s) {application = getServletContext();i++;vector.add("NO." + i + "," + s);application.setAttribute("mess", vector);//如果添加的2个对象的关键字相同，则先前的关键字被清除,mess叫索引关键字}%><a href="chuli.jsp">返回留⾔界⾯</a><%@ page contentType="text/html; charset=gb2312"%><%@ page import="java.util.Vector"%><%!public String handString(String s) {try {byte b[] = s.getBytes("gb2312");s = new String(b);} catch (Exception exp) {}return s;}%><%Vector vector = (Vector) application.getAttribute("mess");//因为任何对象都可以添加到application中，取回对象时，//所以要强制转回原来的类型。
写⼀个简单的HTML留⾔板最近有点懒，没码什么字，防⽌遗忘，从头开始码，写⼀个简单的HTML留⾔板。
包含两个⽂件，book.html还有style.css，放在同⼀⽬录下。
book.html1<!DOCTYPE html>2<html>3<head>4<meta charset="utf-8"/>5<title>实战留⾔板</title>6<link rel="stylesheet" type="text/css" href='style.css' />7</head>8<body>9<h1 align="center">码夫破⽯防遗忘写的⼀个简单的留⾔板</h1>10<h6 align="center">纯HTML，没有任何脚本</h6>11<div class='main'>12<!-- BOF 发表留⾔ -->13<div class='add'>14<textarea class='content' cols='50' rows='5'></textarea>15<br/>16<input class='user' type='text' />17<input class='btn' type='submit' value="提交"/>18</div>19<!-- EOF 发表留⾔ -->2021<!-- BOF 查看留⾔ -->22<div class='msg'>23<div class='info'>24<span class='user'>留⾔⼈</span>25<span class='time'>留⾔时间：2020-05-22 15:23:23</span>26</div>27<div class='content'>28留⾔内容，留⾔内容，留⾔内容，留⾔内容，留⾔内容，留⾔内容，留⾔内容。
基于Java EE的高级程序设计——实验一实验名称项目名称：基于JSP的留言系统开发课时安排：2课时实验要求实验要求：用JSP、Servlet和JavaBean开发一个简单的留言系统。
实验目标学习JSP、Servlet等技术，完成一个简单的留言系统的开发，实现登录、留言发布等功能，通过本次实验让学生熟悉JSP和Servlet的开发步骤，掌握实现MVC架构所需要的实践技能。
（1）熟悉HTML（2）熟悉Servlet（3）熟悉JSP（4）熟悉JDBC（5）掌握JSP、Servlet开发方法（6）完成系统，并打包运行需求分析系统原型相关界面：登录相关界面如下图所示：留言相关界面如下图所示：实验步骤1、需求分析既然是留言系统，肯定要有用户登录，所以需要一个用户表（userTable）。
字段包括：id、username 和password。
其中id设为自动增长的int型，并设为主键。
username和password都设为varchar型。
登录成功后要有个主界面，显示别人和自己的留言信息，那就应该有个留言表（lyTable）。
字段包括：id、userId、date、title、content。
其中id设为自动增长的int型，并设为主键。
userId是user表中的id，表明该条留言是该用户留的。
2、建立数据库与表建立数据库，命名为“javaee”，这里我们用的是MySQL。
然后在该数据库中建立上面提到的两个表：userTable表、lyTable表。
userTable表：lyTable表：CREATE TABLE `usertable` (`id` int(11) NOT NULL auto_increment, `username` varchar(50) default NULL, `password` varchar(20) default NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=gbk CREATE TABLE `lytable` (`id` int(11) NOT NULL auto_increment,`userId` int(11) default NULL,`data` datetime default NULL,`title` varchar(50) default NULL,`content` varchar(500) default NULL,PRIMARY KEY (`id`)) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=gbk 3、新建项目打开MyEclipse，新建项目，命名为“JSPExample”。
JSP简单留言板本留言板是基于JSP及数据库技术制作的简单留言板，整个留言板共三个jsp文件，即用户留言页面（message_insert.jsp）、留言存入数据库文件（message_insert_do.jsp）、显示留言页面（show.jsp）。
该留言板实现了分页、跳页、降序排列留言、控制留言字数等效果，对于有些许jsp及数据库基础的爱好者非常适用。
以下为该留言板的代码，数据库请自行创建，数据库名：messageborder，表名：message，表中共五个字段，id(自增)，name,mail,qq,txt。
message_insert.jsp<%@page contentType="text/html;charset=GBK"%><%@page import="java.sql.*"%><%@page import="java.util.*"%><html><head><title>我要留言</title></head><body bgcolor="green"><%request.setCharacterEncoding("GBK");%><form name="form1" method="post"action="message_insert_do.jsp"><table width="450" border="1" align="center"bgcolor="#e8e8e8"><tr><th colspan="2"><h2>我要留言</h2></th></tr><tr><td>昵称：</td><td><input name="name" type="text" size="20">*请不要超15个字符</td></tr><tr><td>E-mail:</td><td><input name="mail" type="text" size=20></td></tr><tr><td>Q Q:</td><td><input name="qq" type="text" size="20"></td></tr><tr><td rowspan="2">留言内容：</td><td><textarea name="txt" cols="30" rows="5"></textarea></td><tr><td>*请不要超过300个字符</td></tr></tr><tr><th colspan="2"><input type="submit" name="submit" value="提交"> <input type="reset" name="reset" value="重置"> </th></tr></table></from></body></html>message_insert_do.jsp<%@page contentType="text/html;charset=GBK"%><%@page import="java.sql.*"%><%@page import="java.util.*"%><html><head><title>留言板</title></head><center><body><%request.setCharacterEncoding("GBK");%><%String name=request.getParameter("name");String mail=request.getParameter("mail");String qq=request.getParameter("qq");String txt=request.getParameter("txt");%><%boolean a=true;if(name.length()>15||name.length()==0){out.println("昵称长度不能大于15且不能为空!"); %><br><%a=false;if(mail.length()>30){out.println("E-mail长度不能大于30！");%><br><%a=false;}if(qq.length()>15){out.println("QQ长度不能大于15！");%><br><%a=false;}if(txt.length()>300||txt.length()==0){out.println("留言内容不能超过300且不能为空！"); %><br>a=false;}if(!a){%><h4>留言失败，请重新<a href="message_insert.jsp">留言</a>！</h4><%}else{%><center><h1>留言板</h1><hr><%!public static final String DBDRIVER="com.mysql.jdbc.Driver"; public static final StringDBURL="jdbc:mysql://localhost:3306/messageborder(数据库)"; public static final String DBUSER="root";//（我的数据库用户名）public static final String DBPASS="000000";//(我的数据库密码) %><%try{Class.forName(DBDRIVER);Connection conn=DriverManager.getConnection(DBURL,DBUSER,DBPASS);Statement pstmt = conn.createStatement() ;String sql="insert into message(name,mail,qq,txt) values(" + "\'" + name + "\'" + "," + "\'" + mail+ "\'" + "," + "\'" + qq + "\'" + "," +"\'" +txt+"\')";pstmt.executeUpdate(sql) ;pstmt.close();conn.close();%><h2>恭喜您，留言成功！</h2><%}catch(Exception e){%><h2>操作中出现错误，点击此处<a href="message_insert.jsp">【*】</a>请重新留言！</h2><%}%>//留言成功，则跳转到show.jsp页面response.sendRedirect("show.jsp");%></center><%}%></center></body></html>show.jsp<%@page contentType="text/html;charset=GBK"%> <%@page import="java.sql.*"%><%@page import="java.util.*"%><html><head><title>留言板</title></head><body bgcolor="#e8e8e8">request.setCharacterEncoding("GBK");%><%!public static final String SPURL="show.jsp";%><%int currentPage = 1 ; // 表示当前所在的页是第一页int lineSize =10; // 每页显示10条记录int allRecorders=0; //所有记录int pageSize=0; //页数%><%try{currentPage =Integer.parseInt(request.getParameter("cp")) ;}catch(Exception e){}%><center><h1>留言板</h1><a href="message_insert.jsp"><font color="green" size="+2">*【我要留言】*</font></a><hr><%!public static final String DBDRIVER="com.mysql.jdbc.Driver"; public static final StringDBURL="jdbc:mysql://localhost:3306/messageborder";public static final String DBUSER="root";public static final String DBPASS="000000";%><%Connection conn=null;PreparedStatement pstmt=null;ResultSet rs=null;%><%try{Class.forName(DBDRIVER);conn=DriverManager.getConnection(DBURL,DBUSER,DBPASS);String sql="SELECT COUNT(id) from message";pstmt=conn.prepareStatement(sql);rs=pstmt.executeQuery();if(rs.next()){allRecorders=rs.getInt(1);//取出全部记录数}pageSize=(allRecorders+lineSize-1)/lineSize;rs.close();pstmt.close();%><script language="javaScript">function go(c){document.getElementById("cp").value = c ;document.spform.submit() ; // 提交表单}</script><form action="<%=SPURL%>" name="spform" method="post"> <input type="button" value="首页" onClick="go(1)" <%=currentPage==1?"disabled":""%>><input type="button" value="上一页"onClick="go(<%=currentPage-1%>)"<%=currentPage==1?"disabled":""%>><input type="button" value="下一页"onClick="go(<%=currentPage+1%>)"<%=currentPage==pageSize?"disabled":""%>><input type="button" value="尾页"onClick="go(<%=pageSize%>)"<%=currentPage==pageSize?"disabled":""%>><input type="hidden" name="cp" value="">跳转到<select name="cpsel" onchange="go(this.value)"><%for(int i=1;i<=pageSize;i++){%><option value="<%=i%>"<%=currentPage==i?"selected":""%>><%=i%></option><%}%></select>页</form><%sql="SELECT id,name,mail,qq,txt from message order by id desc";//对留言内容降序排列，以保证最后的留言在最上面显示pstmt=conn.prepareStatement(sql);rs=pstmt.executeQuery();%><table border="1" width="80%"><%for(int i=0;i<(currentPage-1)*lineSize;i++){rs.next() ; // 空出10条记录}for(int i=0;i<lineSize;i++){ // 显示linSize规定的数据记录if(rs.next()){int id=rs.getInt(1);String name=rs.getString(2);String mail=rs.getString(3);String qq=rs.getString(4);String txt=rs.getString(5);%><tr><td>您好:<font color="blue" size="+2"><%=name%></font><br> <font color="green" size="-1">您是第<%=id%>位留言者</font><br> 您的留言是：<fontcolor="red"size="+1"><%=txt%></font></td></tr><%}}%></table><%}catch(Exception e){%><h2>留言失败，请重新<a href="message_insert.jsp">【留言】</a>!</h2><%}finally{try{conn.close();}catch(Exception e){}}%></center></body></html>。
