js写的评论分页(还不错)


Posted in Javascript onDecember 23, 2013
<%@ page language="java" contentType="text/html; charset=utf-8" 
pageEncoding="utf-8"%> 
<% 
String path = request.getContextPath(); 
String basePath = request.getScheme() + "://" 
+ request.getServerName() + ":" + request.getServerPort() 
+ path + "/"; 
%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>微客服</title> 
<style type="text/css"> 
body{ 
text-align: center; 
margin: 0; 
padding: 0; 
color: #500f60; 
background: url("../images/bj_4.jpg"); 
background-repeat:no-repeat; 
background-attachment: scroll; 
background-size:100% 100%; 
overflow-x: hidden; 
} 
li{ 
list-style-type: none; 
} 
a:link{ 
list-style-type: none; 
} 
img{ 
width: 100%; 
} 
#static{ 
margin: 0 auto; 
text-align: left; 
width: 90%; 
margin-top: 20px; 
} 
.aa{ 
padding-left: 16px; 
} 
#bott{ 
border: 3px #590303 solid; 
border-radius: 6px 6px 6px 6px; 
-moz-border-radius: 6px; 
width: 90%; 
margin-left: 5%; 
} 
.tex{ 
border-top: none; 
border-bottom: none; 
border-left: none; 
border-right: none; 
background: fixed; 
} 
</style> 
</head> 
<script type="text/javascript"> 
$(function() { 
var row = 5; 
//动态加评论信息 
function loadCommentInfo(page) { 
$("#page").text(page); 
$.ajax({ 
type : "POST", 
url : "<%=basePath%>findClickCommentByPage.action", 
data: "page="+page+"&row="+row, 
success : function(data) { 
var list = data.list; 
var row = ""; 
$("#comments").empty(); 
for ( var i = 0; i < list.length; i++) { 
row = "<h3><span style=\"color: #000; font-size: 0.5em; padding-left: 70%;\">"+list[i].time+"</span></h3>"+ 
"<h3 style=\"padding-left: 12px;\">"+list[i].content+"</h3>"; 
if(list[i].repcontent!=null){ 
row+="<h3 style=\"padding-left: 12px; word-wrap: break-word; word-break: normal;\">回复:"+list[i].repcontent+"</h3>"; 
} 
"<hr size=\"5px;\" color=\"#f0f\">"; 
$(row).appendTo($("#comments")); 
} 
$("#pagetag").val(page); 
} 
}); 
}; 
function getTotalContent() { 
$.ajax({ 
type : "POST", 
url : "<%=basePath%>getTotalNum.action", 
success : function(data) { 
$("#count").text(data.total); 
if(parseInt(data.total)==0){ 
$("#page").text(0); 
} 
var pagenum = parseInt(data.total/row); 
$("#totalpage").text(parseInt(data.total%row==0?pagenum:pagenum+1)); 
}, 
}); 
} 
$("#submit").click(function(){ 
var content = $("#content").val(); 
if(content==""){ 
alert("内容不能为空!"); 
return; 
} 
$.post("<%=basePath%>addClickComment.action","content="+content,function(data){ 
if(data.success == true) { 
alert("发表成功!"); 
$("#content").val(""); 
loadCommentInfo(parseInt($("#pagetag").val())); 
getTotalContent(); 
} 
}); 
}); 
$("#pre").click(function(){ 
var page = parseInt($("#pagetag").val()); 
if(page>1){ 
page--; 
loadCommentInfo(page); 
} 
}); 
$("#next").click(function(){ 
var page = parseInt($("#pagetag").val()); 
if(page<parseInt($("#totalpage").text())){ 
page++; 
loadCommentInfo(page); 
} 
}); 
window.onload = loadCommentInfo(1); 
window.onload = getTotalContent(); 
}); 
</script> 
<body> 
<input type="hidden" id="pagetag" value="1"> 
<div id="static"> 
<div style="text-align: left; z-index: 999"> 
<img src="../pic/top4.jpg"> 
<a href="<%=basePath%>jsp/index.jsp"><img src="../pic/fan_2.png" style="width: 10%; margin-top: -25px;"></a> 
</div> 
<button style="background: #520202; border-top: none;border: 3px #520202 solid; border-radius: 2px 2px 2px 2px;-moz-border-radius: 6px; color: #FFEA00;" id="pre">上一页</button> 
<button style="background: #520202; border-top: none;border: 3px #520202 solid; border-radius: 2px 2px 2px 2px;-moz-border-radius: 6px;float: right; color: #FFEA00;" id="next">下一页</button> 
<p style="background: #520202; color: #FFEA00;">第<span id="page"></span>/<span id="totalpage"></span>页</p> 
<h1 class="aa">评论(<span id="count"></span>)</h1> 
<hr size="5px;" color="#590303"> 
<div id="comments"> 
</div> 
<h2 class="aa">发表评论</h2> 
<h3 class="aa">您的评论:</h3> 
<div id="bott"> 
<textarea rows="7" class="tex" cols="100%" id="content"></textarea> 
</div> 
<button style="margin-left:80%; border-top: none;border: 3px #520202 solid; border-radius: 6px 6px 6px 6px;-moz-border-radius: 6px; color: #FFEA00; background: #520202;" id="submit">发表</button> 
</div> 
</body> 
</html>

dao层
package dfml.daoImpl; import java.sql.SQLException; 
import java.util.List; 
import javax.annotation.Resource; 
import org.hibernate.Criteria; 
import org.hibernate.HibernateException; 
import org.hibernate.Query; 
import org.hibernate.Session; 
import org.hibernate.criterion.Order; 
import org.springframework.orm.hibernate3.HibernateCallback; 
import org.springframework.orm.hibernate3.HibernateTemplate; 
import org.springframework.stereotype.Component; 
import dfml.dao.ClickCommentDao; 
import dfml.pojo.ClickComment; 
@Component 
public class ClickCommentDaoImpl implements ClickCommentDao{ 
private HibernateTemplate hibernateTemplate; 
@Resource 
public void setHibernateTemplate(HibernateTemplate hibernateTemplate) { 
this.hibernateTemplate = hibernateTemplate; 
} 
//添加一条评论信息 
@Override 
public boolean addClickComment(ClickComment clickComment) { 
boolean isSuccess = false; 
try { 
hibernateTemplate.save(clickComment); 
isSuccess = true; 
} catch (Exception e) { 
isSuccess = false; 
e.printStackTrace(); 
} 
return isSuccess; 
} 
//分页查找评论信息 
@SuppressWarnings("unchecked") 
@Override 
public List<ClickComment> findClickCommentByPage(final int page, final int row) { 
List<ClickComment> list = this.hibernateTemplate 
.executeFind(new HibernateCallback<Object>() { 
@Override 
public Object doInHibernate(Session session) 
throws HibernateException, SQLException { 
Criteria c = session.createCriteria(ClickComment.class); 
c.setFirstResult((page - 1) * row); 
c.setMaxResults(row); 
c.addOrder(Order.desc("time")); 
return c.list(); 
} 
}); 
return list; 
} 
//得到评论的个数 
@SuppressWarnings({ "unchecked", "rawtypes" }) 
@Override 
public Long getClickCommentCount() { 
final String hql = "select count(*) from ClickComment"; 
Long result = null; 
result = (Long) hibernateTemplate.execute(new HibernateCallback() { 
public Object doInHibernate(Session arg0) 
throws HibernateException, SQLException { 
Query query = arg0.createQuery(hql); 
return query.uniqueResult(); 
} 
}); 
return result; 
} 
//更新评论信息 
@Override 
public boolean updateClickComment(ClickComment clickComment) { 
boolean isSuccess=false; 
try { 
hibernateTemplate.update(clickComment); 
isSuccess=true; 
} catch (Exception e) { 
e.printStackTrace(); 
isSuccess=false; 
} 
return isSuccess; 
} 
//根据id查找评论信息 
@Override 
public ClickComment findClickCommentById(int id) { 
return (ClickComment) hibernateTemplate.find("from ClickComment where id = ?", 
id).get(0); 
} 
//删除评论信息 
@Override 
public boolean deleteClickComment(ClickComment clickComment) { 
boolean isSuccess=false; 
try { 
hibernateTemplate.delete(clickComment); 
isSuccess=true; 
} catch (Exception e) { 
e.printStackTrace(); 
isSuccess=false; 
} 
return isSuccess; 
} 
//查询所有的评论 
@SuppressWarnings("unchecked") 
@Override 
public List<ClickComment> findAllClickComment() { 
return hibernateTemplate.find("from ClickComment"); 
} 
}

struts配置
<package name="clickComment" extends="json-default" namespace="/"> 
<action name="addClickComment" method="addClickComment" class="clickCommentAction"> 
<result name="add" type="json"> 
<param name="root">map</param> 
</result> 
</action> 
<action name="findClickCommentByPage" method="findClickCommentByPage" class="clickCommentAction"> 
<result name="findByPage" type="json"> 
<param name="root">map</param> 
</result> 
</action> 
<action name="getTotalNum" method="getTotalNum" class="clickCommentAction"> 
<result name="total" type="json"> 
<param name="root">map</param> 
</result> 
</action> 
<action name="updateClickComment" method="updateClickComment" class="clickCommentAction"> 
<result name="update" type="json"> 
<param name="root">map</param> 
</result> 
</action> 
<action name="findAllClickComment" method="findAllClickComment" class="clickCommentAction"> 
<result name="list" type="json"> 
<param name="root">map</param> 
</result> 
</action> 
<action name="deleteClickComment" method="deleteClickComment" class="clickCommentAction"> 
<result name="delete" type="json"> 
<param name="root">map</param> 
</result> 
</action>

action
package dfml.action; import java.sql.Date; 
import java.text.SimpleDateFormat; 
import java.util.HashMap; 
import java.util.List; 
import java.util.Map; 
import javax.annotation.Resource; 
import org.springframework.context.annotation.Scope; 
import org.springframework.stereotype.Component; 
import com.opensymphony.xwork2.ActionSupport; 
import dfml.dao.ClickCommentDao; 
import dfml.pojo.Activity; 
import dfml.pojo.ClickComment; 
@Component("clickCommentAction") 
@Scope("prototype") 
public class ClickCommentAction extends ActionSupport{ 
private static final long serialVersionUID = 1L; 
private ClickCommentDao clickCommentDao; 
private Map<String, Object> map; 
private String content;// 评论内容 
private String repcontent;// 回复评论 
private int page; 
private int row; 
private int rows; 
private int id; 
public void setId(int id) { 
this.id = id; 
} 
public Map<String, Object> getMap() { 
return map; 
} 
@Resource 
public void setClickCommentDao(ClickCommentDao clickCommentDao) { 
this.clickCommentDao = clickCommentDao; 
} 
public void setContent(String content) { 
this.content = content; 
} 
public void setRepcontent(String repcontent) { 
this.repcontent = repcontent; 
} 
public void setPage(int page) { 
this.page = page; 
} 
public void setRow(int row) { 
this.row = row; 
} 
public void setRows(int rows) { 
this.rows = rows; 
} 
//添加评论 用于微信用户 
public String addClickComment() { 
boolean isSuccess = false; 
map = new HashMap<String, Object>(); 
ClickComment clickComment = new ClickComment(); 
SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); 
clickComment.setTime(format.format(new Date(System.currentTimeMillis()))); 
clickComment.setContent(content); 
try { 
isSuccess = clickCommentDao.addClickComment(clickComment); 
} catch (Exception e) { 
isSuccess = false; 
e.printStackTrace(); 
} 
map.put("success", isSuccess); 
return "add"; 
} 
//分页查找评论 用户微信用户 
public String findClickCommentByPage() { 
map = new HashMap<String, Object>(); 
map.put("list", clickCommentDao.findClickCommentByPage(page, row)); 
return "findByPage"; 
} 
//查询评论条数 用于微信用户 
public String getTotalNum(){ 
map = new HashMap<String, Object>(); 
map.put("total", clickCommentDao.getClickCommentCount()); 
return "total"; 
} 
//回复评论 用于后台管理 
public String updateClickComment(){ 
boolean isSuccess=false; 
map=new HashMap<String, Object>(); 
ClickComment clickComment =clickCommentDao.findClickCommentById(id); 
if(clickComment!=null){ 
clickComment.setRepcontent(repcontent); 
isSuccess=clickCommentDao.updateClickComment(clickComment); 
} 
map.put("success", isSuccess); 
return "update"; 
} 
//查询所有评论 用于后台管理 
public String findAllClickComment(){ 
map=new HashMap<String, Object>(); 
List<ClickComment> lists=clickCommentDao.findClickCommentByPage(page, rows); 
List<ClickComment> listss=clickCommentDao.findAllClickComment(); 
map.put("rows", lists); 
map.put("total", listss.size()); 
map.put("list", listss); 
return "list"; 
} 
//删除评论 用于后台管理 
public String deleteClickComment(){ 
boolean isSuccess=false; 
map=new HashMap<String, Object>(); 
ClickComment clickComment =clickCommentDao.findClickCommentById(id); 
if(clickComment!=null){ 
isSuccess=clickCommentDao.deleteClickComment(clickComment); 
} 
map.put("success", isSuccess); 
return "delete"; 
} 

}

pojo
package dfml.pojo; import java.io.Serializable; 
import javax.persistence.Entity; 
import javax.persistence.GeneratedValue; 
import javax.persistence.Id; 
//评论表 
@Entity 
public class ClickComment implements Serializable{ 

private static final long serialVersionUID = 1L; 
private Integer id; 
private String time;// 评论时间 
private String content;// 评论内容 
private String name;// 评论人 
private String repcontent;//回复评论 

@Id 
@GeneratedValue 
public Integer getId() { 
return id; 
} 
public void setId(Integer id) { 
this.id = id; 
} 
public String getRepcontent() { 
return repcontent; 
} 
public void setRepcontent(String repcontent) { 
this.repcontent = repcontent; 
} 
public String getTime() { 
return time; 
} 
public void setTime(String time) { 
this.time = time; 
} 
public String getContent() { 
return content; 
} 
public void setContent(String content) { 
this.content = content; 
} 
public String getName() { 
return name; 
} 
public void setName(String name) { 
this.name = name; 
} 
}
Javascript 相关文章推荐
appendChild() 或 insertBefore()使用与区别介绍
Oct 11 Javascript
jQuery读取和设定KindEditor值的方法
Nov 22 Javascript
深入理解JQuery keyUp和keyDown的区别
Dec 12 Javascript
JS+CSS实现大气的黑色首页导航菜单效果代码
Sep 10 Javascript
JS实现的鼠标跟随代码(卡通手型点击效果)
Oct 26 Javascript
使用PHP+JavaScript将HTML页面转换为图片的实例分享
Apr 18 Javascript
Bootstrap基本组件学习笔记之进度条(15)
Dec 08 Javascript
javascript 正则表达式去空行方法
Jan 24 Javascript
echarts学习笔记之图表自适应问题详解
Nov 22 Javascript
JavaScript面试出现频繁的一些易错点整理
Mar 29 Javascript
vue.js打包之后可能会遇到的坑!
Jun 03 Javascript
layer的prompt弹出框,点击回车,触发确定事件的方法
Sep 06 Javascript
用js来刷新当前页面保留参数的具体实现
Dec 23 #Javascript
jquery插件jTimer(jquery定时器)使用方法
Dec 23 #Javascript
jquery实现图片翻页效果
Dec 23 #Javascript
js substring从右边获取指定长度字符串(示例代码)
Dec 23 #Javascript
JS判断对象是否存在的10种方法总结
Dec 23 #Javascript
JS判断表单输入是否为空(示例代码)
Dec 23 #Javascript
js中判断用户输入的值是否为空的简单实例
Dec 23 #Javascript
You might like
加强版phplib的DB类
2008/03/31 PHP
连接到txt文本的超链接,不直接打开而是点击后下载的处理方法
2009/07/01 PHP
让PHP COOKIE立即生效,不用刷新就可以使用
2011/03/09 PHP
利用php绘制饼状图的实现代码
2013/06/07 PHP
PHP实现可自定义样式的分页类
2016/03/29 PHP
PHP copy函数使用案例代码解析
2020/09/01 PHP
javascript去除字符串左右两端的空格
2015/02/05 Javascript
javascript如何实现暂停功能
2015/11/06 Javascript
Nodejs如何复制文件
2016/03/09 NodeJs
jquery mobile 实现自定义confirm确认框效果的简单实例
2016/06/17 Javascript
AngularJS 与Bootstrap实现表格分页实例代码
2016/10/14 Javascript
ReactJS实现表单的单选多选和反选的示例
2017/10/13 Javascript
深入剖析Node.js cluster模块
2018/05/23 Javascript
Vue实现本地购物车功能
2018/12/05 Javascript
新手入门带你学习JavaScript引擎运行原理
2019/06/24 Javascript
js实现树形数据转成扁平数据的方法示例
2020/02/27 Javascript
python实现批量下载新浪博客的方法
2015/06/15 Python
在win10和linux上分别安装Python虚拟环境的方法步骤
2019/05/09 Python
nginx+uwsgi+django环境搭建的方法步骤
2019/11/25 Python
解决pytorch报错:AssertionError: Invalid device id的问题
2020/01/10 Python
Python要如何实现列表排序的几种方法
2020/02/21 Python
Python的Django框架实现数据库查询(不返回QuerySet的方法)
2020/05/19 Python
PyCharm中如何直接使用Anaconda已安装的库
2020/05/28 Python
CSS3 不定高宽垂直水平居中的几种方式
2020/03/26 HTML / CSS
丽笙酒店官方网站:Radisson Hotels
2019/05/07 全球购物
汇智创新科技发展有限公司
2015/12/06 面试题
小学数学教学反思
2014/02/02 职场文书
乳制品整治工作方案
2014/05/29 职场文书
五一劳动节演讲稿
2014/09/12 职场文书
2014年驻村干部工作总结
2014/11/17 职场文书
检察院起诉书
2015/05/20 职场文书
告知书格式
2015/07/01 职场文书
教师素质教育心得体会
2016/01/19 职场文书
继承Win10缺点!教你关闭Win11烦人的网络搜索
2021/11/23 数码科技
MySQL磁盘碎片整理实例演示
2022/04/03 MySQL
python DataFrame中stack()方法、unstack()方法和pivot()方法浅析
2022/04/06 Python