首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

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; 
} 
}

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

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
JavaScript 获得选中文本内容的方法
Feb 15 Javascript
JavaScript中继承的一些示例方法与属性参考
Aug 07 Javascript
js去空格技巧分别去字符串前后、左右空格
Oct 21 Javascript
javascript时间函数大全
Jun 30 Javascript
JavaScript输出当前时间Unix时间戳的方法
Apr 06 Javascript
layui导航栏实现代码
May 19 Javascript
Chrome调试折腾记之JS断点调试技巧
Sep 11 Javascript
Vue组件中的data必须是一个function的原因浅析
Sep 03 Javascript
vue 强制组件重新渲染(重置)的两种方案
Oct 29 Javascript
vue中利用iscroll.js解决pc端滚动问题
Feb 15 Javascript
vue基于better-scroll实现左右联动滑动页面
Jun 30 Javascript
Element InputNumber 计数器的实现示例
Aug 03 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
Navicat(1) procedure(1) maven(2) 内置函数(1) Tablespace(1) V Rising(1) 记事本(1) Android Gradle(1) commit(1) 自定义函数(1)
You might like
php中批量修改文件后缀名的函数代码
2011/10/23 PHP
PHP验证码函数代码(简单实用)
2013/09/29 PHP
php实现的发送带附件邮件类实例
2014/09/22 PHP
PHP获取IP地址所在地信息的实例(使用纯真IP数据库qqwry.dat)
2016/11/15 PHP
PHP中有关长整数的一些操作教程
2019/09/11 PHP
PHP读取Excel内的图片(phpspreadsheet和PHPExcel扩展库)
2019/11/19 PHP
ThinkPHP5与单元测试PHPUnit使用详解
2020/02/23 PHP
jQuery+jqmodal弹出窗口实现代码分明
2010/06/14 Javascript
基于jquery的3d效果实现代码
2011/03/23 Javascript
JavaScript正则表达式的分组匹配详解
2016/02/13 Javascript
移动端 一个简单易懂的弹出框
2016/07/06 Javascript
AngularJS递归指令实现Tree View效果示例
2016/11/07 Javascript
JavaScript中定时控制Throttle、Debounce和Immediate详解
2016/11/17 Javascript
JavaScript正则表达式小结(test|match|search|replace|split|exec)
2016/12/08 Javascript
js学习总结_轮播图之渐隐渐现版(实例讲解)
2017/07/17 Javascript
深入理解JavaScript和TypeScript中的class
2018/04/22 Javascript
Vue组件之单向数据流的解决方法
2018/11/10 Javascript
Vue中computed、methods与watch的区别总结
2019/04/10 Javascript
ES6之Proxy的get方法详解
2019/10/11 Javascript
python列表操作实例
2015/01/14 Python
用Python写王者荣耀刷金币脚本
2017/12/21 Python
Python callable()函数用法实例分析
2018/03/17 Python
Python zip()函数用法实例分析
2018/03/17 Python
Python 经典面试题 21 道【不可错过】
2018/09/21 Python
Python补齐字符串长度的实例
2018/11/15 Python
Python实现SQL注入检测插件实例代码
2019/02/02 Python
python自动结束mysql慢查询会话的实例代码
2019/10/27 Python
TensorFlow通过文件名/文件夹名获取标签,并加入队列的实现
2020/02/17 Python
使用jupyter notebook运行python和R的步骤
2020/08/13 Python
女孩每月服装订阅盒：kidpik
2019/04/17 全球购物
英国No.1体育用品零售商：SportsDirect.com
2019/10/16 全球购物
求职简历的自我评价
2014/01/31 职场文书
“学雷锋活动月”总结
2014/03/09 职场文书
护理专科毕业自荐信范文
2014/04/21 职场文书
爱护公物演讲稿
2014/09/09 职场文书
农村房屋租赁合同（范本）
2019/07/23 职场文书