jsp做的一个简易留言板功能

本文介绍了一个留言板系统的实现细节,包括留言提交、回复、删除等功能及其实现代码。文章还详细介绍了如何使用Ajax实现实时更新留言内容,以及通过JavaScript实现分页显示大量留言的技术。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.先登录才能留言

2.可以留言

3.可以回复

4.自己写的留言可以自己删除

5.留言进行分页显示,避免留言只能显示一部分

1.登录后会有

2.写留言

提交按钮在你没写东西前是不能提交的,用了onkeyup()方法

提交后马上显示在留言列表,ajax技术

相关代码:

function sendtext(){
var text1=form1.textfield.value;
if(text1!=""){
createRequest1("insert1.jsp?textfield="+encodeURI(text1));
}
}
function createRequest1(url){
http_request=new XMLHttpRequest();
http_request.onreadystatechange=function(){
if(http_request.readyState==4){
if(http_request.status==200){
document.getElementById("textfield").value="";
document.getElementById("display1").innerHTML=http_request.responseText+document.getElementById("display1").innerHTML;
}else{
alert("error");

}
}
}
http_request.open("POST",url,true);
http_request.send(null);
}

//后台直接返回

 

刷新后会否回复与删除功能,

 

相关代码:

刷新页面后,在后来用select语言从数据库中找出

然后在前台获取

//删除回复部分代码

"<input  type='button' id='show'  value='回复' onclick=show1("+rs.getString(1)+") style='width:50px;height:20px;background-color:#90ee90;padding:0;border-radius:15px;box-shadow: 1px 1px 1px #888888'>"+"<input type='button' value='删除' style='width:50px;height:20px;background-color:#90ee90;padding:0;border-radius:15px;box-shadow: 1px 1px 1px #888888' onclick='delete1("+rs.getString(1)+")'>"

换一个用户登录

可以看到别人写的是不能删除的只有自己写的才能删除

用了if语句判断

3,回复

点击回复会有下拉框,这是用js实现的

提交后直接显示

 相关代码

function replay1(id1,id2,id3){
var text1=document.getElementById(id2);
var text2=text1.value
var name='<%=message1%>'
document.getElementById(id3).innerHTML="<font color='saddlebrown' font size='4px'>"+"回复者:"+name+"</font>"+"<br>"+document.getElementById(id2).value+"<br>"+document.getElementById(id3).innerHTML;
createRequest4("reply1.jsp?id1="+id1+"&text1="+text2);

}

刷新后效果

4.删除

删除后直接消失

前段实现代码:

 

 后台实现代码

5.分页

首先写好分页规则

function page(opt){//编写分页规则
if(!opt.id){return false};
var obj=document.getElementById(opt.id);
var nowNum=opt.nowNum||1;
var allNum=opt.allNum||5;
var callBack = opt.callBack || function(){};
if(nowNum>=4&&allNum>=6){
var oA=document.createElement('a');
oA.href="#1";
oA.innerHTML='首页';
obj.appendChild(oA);
}
if(nowNum>=2){
var oA=document.createElement('a');
oA.href="#"+(nowNum-1);
oA.innerHTML='上一页';
obj.appendChild(oA);
}

if(allNum<=5){
for(var i=1;i<=allNum;i++){
var oA=document.createElement('a');
oA.href="#"+i;
if(nowNum==i){
oA.innerHTML=i;
}else{
oA.innerHTML='['+i+']';
}
obj.appendChild(oA);
}
}else{
for(var i=1;i<=5;i++){
var oA=document.createElement('a');
if(nowNum==1||nowNum==2){
oA.href="#"+i;
if(nowNum==i){oA.innerHTML=i;
}else{
oA.innerHTML='['+i+']';
}

}else if((allNum-nowNum)==0||(allNum-nowNum)==1){
oA.href="#"+(allNum-5)+i;
if(((allNum-nowNum)==0)&&i==5){
oA.innerHTML=((allNum-5)+i);
}else if((allNum-nowNum)==1&&i==4){
oA.innerHTML=((allNum-5)+i);
}else{
oA.innerHTML='['+((allNum-5)+i)+']';
}

}else{
oA.href="#"+(nowNum-3+i);
if(i==3){
oA.innerHTML=(nowNum-3+i);
}else{
oA.innerHTML='['+(nowNum-3+i)+']';
}

}
obj.appendChild(oA);
}
}
if(allNum-nowNum>=1){
var oA = document.createElement('a');
oA.href = '#' + (nowNum+1);
oA.innerHTML = "下一页";
obj.appendChild(oA);
}

if((allNum-nowNum)>=3 && allNum>=6){
var oA = document.createElement('a');
oA.href="#"+(allNum);
oA.innerHTML='尾页';
obj.appendChild(oA);
}

callBack(nowNum,allNum);

var aA=obj.getElementsByTagName('a');
for(var i=0;i<aA.length;i++){
aA[i].onclick = function(){
var nowNum = parseInt(this.getAttribute('href').substring(1));
obj.innerHTML = "";
page({
id : opt.id,
nowNum : nowNum,
allNum : allNum,
callBack : callBack
});
};
}
}

//然后去数据库里吧所有的留言都获取一下,计算要获得多少页

//再把页数之传回

 

window.onload=function(){ //得到总共分为几页
createRequest("serchcount.jsp");
}
function createRequest(url){
http_request=new XMLHttpRequest();
http_request.onreadystatechange=function(){
if(http_request.readyState==4){
if(http_request.status==200){
var count2=http_request.responseText;//把得到的页数存入到count2中
fenye(count2);//把参数传给fenye()这个方法中
}else{
alert("error");
}
}
}
http_request.open("POST",url,true);
http_request.send(null);
}

//把相应的值传到可以调用分页规的函数中

function fenye(count2){
page({
id:'div1',//div名称
nowNum: 1,//开始值
allNum : count2,//总共值
callBack : function(now,all){
serch1(now);}

});
}

 //把当前页的也属传到后台数据库中,一页页的找

后台数据库的查找,后台去执行,并返回值

 

转载于:https://www.cnblogs.com/cjh1/p/6618700.html

一、设计目的 留言系统目前在各类网站中被广泛使用。通过综合运用JSP、Servlet、JavaBean、JDBC、MySQL和MVC + DAO等技术与方法,设计与实现一个留言管理系统,进一步理解和掌握Java Web编程开发的基本技术和方法,熟练使用开发工具。 二、课程设计内容 设计留言管理系统的目的是提供对留言的增加、删除、修改和显示的功能。 系统分前台和后台两个模块。 1)前台留言模块主要针对普通用户,按功能又分为以下模块。 (1) 发表留言(即添加留言) 普通用户可以在留言管理系统中随意留言,如果留言的字数太少如低于10个字符,系统将给出提示。 (2) 查看留言 可以浏览留言(即查看留言列表)、查看详细留言(即查看某条留言内容)、搜索留言(即查看符合条件的留言列表)、查看友情链接(即导航到别的网站)。 2)后台模块(管理模块)针对管理员提供操作,按功能又分为以下模块。 (1) 登录管理:需要输入管理员账号、口令和验证码,系统将验证、口令和验证码是否正确,如果验证成功,则进入管理员界面;否则,系统提示账号或密码错误的信息。 另外,登录后的管理员可以选择退出登录,进而退出管理界面。(实现提示:将退出请求提交给处理退出的Servlet,在该Servlet中将session失效,再将页面重定向到登录页面。) (2) 留言管理:可以查看所有的留言,可以增加留言(即回复留言)、修改留言、删除留言。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值