前段时间一直忙于期末考试和找实习,好久没写博客了。
这段时间做了个小项目,包含了翻页和富文本编辑器ueditor的两个知识点,ueditor玩的还不是很深,打算玩深后再写篇博客。
要实现翻页功能,只需要设置一个pageindex即可,然后每次加载页面时通过pageindex去加载数据就行。
那么我们可以设置一个隐藏的input框,用于传递pageindex给下个页面。
当我们点击上一页的时候,通过js方法改变pageindex的值,再提交表单即可
二话不多说,看代码,代码里面写的还算比较清楚。
这个是index.jsp的代码。
index.jsp
pageencoding="utf-8"%>
notebook of eric wuint allrecord=0;//总的记录条数,不包含查询后的
int totalrecord=0;//总的记录条数,包含查询后的
int totalpage=1;//总的页面数,包含查询后的
int pageindex=1;//当前页面号,用于控制页面翻转,默认为1
list records=null;
dbbean db=new dbbean();
allrecord=db.getrecordcount();
totalrecord=db.getrecordcount();
totalpage=(totalrecord-1)/10+1;
if(request.getparameter("pageindex")!=null){//不是第一次加载
//要做下数据类型转换
pageindex=integer.valueof(request.getparameter("pageindex"));
if(request.getparameter("keyword")!=null){
string keyword=request.getparameter("keyword");
records=db.getrecords(pageindex,keyword);//获取查询内容一页的事件记录集,共10条
totalrecord=db.getrecordcount(keyword);
totalpage=(totalrecord-1)/10+1;
}else{
records=db.getrecords(pageindex);//获取一页的事件记录集,共10条
}
}else{//第一次加载
records=db.getrecords(pageindex);//获取一页的事件记录集,共10条
}
session.setattribute("records", records);//便于后面使用
%>
var pageindex=;
var totalpage=;
console.log(pageindex);
//上一页
function turntoppage(){
if(pageindex==1){
return;
}else{
document.getelementbyid("pageindex").value=pageindex-1;
document.getelementbyid("searchform").submit();
}
}
//下一页
function turnbottompage(){
if(pageindex>=totalpage){
return;
}else{
document.getelementbyid("pageindex").value=pageindex+1;
document.getelementbyid("searchform").submit();
}
}
function searchkeyword(){
document.getelementbyid("pageindex").value=1;
document.getelementbyid("searchform").submit();
}
效果图
翻页后:pageindex=1
翻页后:pageindex=2
以上这篇jsp实现上一页下一页翻页功能(示例代码)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持萬仟网。
希望与广大网友互动??
点此进行留言吧!