html的展示消息和留言板
html的显示消息和留言板
<div class="inner_content"> <c:forEach items="${notices}" var="n"> <c:choose> <c:when test="${n.suffix=='.avi' || n.suffix=='.mp4'}"> <p class="inner_video"> <video src="${n.imageUrl }" width="500" height="375" controls> Your browser dosen't support the video tag. </video> </p> <p style="font-size:10px; line-height:24px;"> ${n.text } </p> </c:when> <c:when test="${n.suffix!='.avi' && n.suffix!='.mp4'}"> <p class="inner_image"> <img src="${n.imageUrl }" width="100%"> </p> <p style="font-size:14px; line-height:24px; text-indent:2em;"> ${n.text } </p> </c:when> </c:choose> </c:forEach> </div>
留言板：
<div class="comment_title"> <h4> 评论（ <c:if test="${empty plNum}">0</c:if> <c:if test="${!empty plNum}">${plNum}</c:if> 条） </h4> </div> <div class="comment_main"> <div id="PLmain"> <c:forEach items="${msgList.list}" var="m"> <dl id="pl_${m.id}"> <dt> <img src="/pages/foreground/images/user_image.jpg"> </dt> <dd> <p> <span class="c_name">${m.uid.uname }</span> <span class="c_time"> ${m.time } </span> <!-- <span class="c_jb"><a href="#">举报</a></span> --> </p> <p class="comment_user"> ${m.leave } </p> <p class="comment_share"> <a href="javascript:void(0);" title="${m.id }" onclick="a_huifu(this);">回复</a> <a href="javascript:void(0);" title="${m.id }" onclick="a_zan(this);">赞（<label id="labzan_${m.id }">${m.zan }</label>）</a> </p> <div id="saydiv${m.id}" class="c_say" style="display:none;"> <textarea id="text${m.id }" placeholder="请输入回复..."></textarea> <c:if test="${empty loginUser}"> <p class="c_text"> 注册成为会员后方可回复 <a class="c_rigister" href="/user/register/user_register!userRegister.ds">注册</a> <span class="c_line">|</span> <a class="c_login" href="#login">登录</a> </p> </c:if> <c:if test="${!empty loginUser}"> <input id="btn_${m.id}" title="${m.websiteMessage.id}" type="button" value="回复" myId="${m.id }" onclick="huifu(this);" /> </c:if> </div> //重点。。。留言的读取 <c:forEach items="${map}" var="h"> //map 集合 <c:forEach items="${h.key}" var="va"> //判断键值 <c:if test="${va eq m.id}"> //判断键值和id号是否相等 <c:forEach items="${h.value}" var="hvalue"> //相等取值 <div class="c_reply" id="re_${hvalue.id }"> <dl> <dt> <img src="/pages/foreground/images/user_image.jpg"> </dt> <dd> <p> <span class="c_name">${hvalue.uid.uname }</span> <span class="c_time"> ${hvalue.time } </span> <!-- <span class="c_jb"><a href="#">举报</a></span> --> </p> <p class="comment_user"> ${hvalue.leave } </p> </dd> </dl> </div> </c:forEach> </c:if> </c:forEach> </c:forEach> </dd> </dl> </c:forEach> </div> <c:if test="${!empty msgList.list}"> <div class="page_num"> <ul> <c:if test="${msgList.pageCount > 1 && msgList.pageNumber != msgList.pageCount}"> <a href="/user/site_message!cgIndex.ds?type=${type}&id=${id}&msgnum=1">首页</a>， <a href="/user/site_message!cgIndex.ds?type=${type}&id=${id}&msgnum=${msgList.pageNumber-1}">上一页</a>， <a href="/user/site_message!cgIndex.ds?type=${type}&id=${id}&msgnum=${msgList.pageNumber+1}">下一页</a>， <a href="/user/site_message!cgIndex.ds?type=${type}&id=${id}&msgnum=${msgList.pageCount}">末页</a> </c:if> <c:if test="${msgList.pageNumber eq msgList.pageCount}"> <a href="/user/site_message!cgIndex.ds?type=${type}&id=${id}&msgnum=1">首页</a>， <a href="/user/site_message!cgIndex.ds?type=${type}&id=${id}&msgnum=${webMessages.pageNumber-1}">上一页</a> </c:if> 第${msgList.pageNumber }页，共${msgList.pageCount }页 </ul> </div> </c:if> </div> <div class="reply_input"> <textarea id="leaveText" placeholder="请控制提问字数在300字以内..."></textarea> <c:if test="${empty loginUser}"> <p class="c_text"> 注册成为会员后方可回复 <a class="c_rigister" href="#">注册</a> <span class="c_line">|</span> <a class="c_login" href="#">登录</a> </p> </c:if> <c:if test="${!empty loginUser}"> <input class="reply_confirm" type="button" value="确定" onclick="pl();" style="overflow: hidden; " /> </c:if> </div> </DIV> <script type="text/javascript"> //获取当地时间 var date=new Date(); var y=date.getFullYear(); var m=(date.getMonth()+1); var d=date.getDate(); var h=date.getHours(); var mm=date.getMinutes(); var s=date.getSeconds(); var ss=date.getMilliseconds(); var da=y+'-'+m+'-'+d+' '+h+':'+mm+':'+s+'.'+ss; var arrContent={};//存类容， var islogin="${loginUser}1";//是否登陆 1 是登陆，否则没有登陆 //回复按钮，显示输入框 function a_huifu(a){ if(arrContent["textId"]){ var cf=confirm('是否离开?'); if(cf==false){ return ; } $(arrContent['textId']).val(''); $(arrContent['textId']).attr({style:"display:none;"}); } var lybmsgId=$(a).attr('title');//留言板 var contentId='#saydiv'+lybmsgId; var contentState=$(contentId).attr('style'); var text="#text"+lybmsgId;//输入的内容的ID if(contentState=='display:none;'){ $(contentId).attr({style:"display:block;"}); } else if(contentState=='display:block;'){ if(islogin!='1'&&$(text).html().length>0){ arrContent['textId']=text; var cf=confirm('是否离开?'); if(cf==true){ //表示，已经登陆了，离开 $(text).val('');//清空留言 $(contentId).attr({style:"display:none;"}); } }else{ $(text).val('');//清空留言 $(contentId).attr({style:"display:none;"}); } } } //确定回复 function huifu(btn){ var btnId=$(btn).attr('id'); var parentId=btnId.substring(4,btnId.length); var msgId=$(btn).attr('title'); var leave=$('#text'+parentId).val(); $.post('/user/site_message!saveReplay.ds', {"parentId":parentId,"type":2,"msgId":msgId,"leave":leave} ,function(data){ alert(data.message); if(data.success){ var text="#text"+parentId;//输入的内容的ID var contentId='#saydiv'+parentId; $(text).val('');//清空留言 $(contentId).attr({style:"display:none;"}); addHtml(btn,leave); } }); } //回复成功后添加html留言 function addHtml(a,leave){ var html="<div class='c_reply' id='re_${hvalue.id }'><dl><dt><img src='/pages/foreground/images/user_image.jpg'></dt>"; html+="<dd><p><span class='c_name'>${hvalue.uid.uname }${loginUser.uname}</span><span class='c_time'>${hvalue.time }"+da+"</span></p>"; html+=" <p class='comment_user'>${hvalue.leave }"+leave+"</p></dd></dl><div>"; $(a).parent().parent().append(html); } //赞 function a_zan(a){ var zanId=$(a).attr('title'); var zanBtnId='#labzan_'+zanId; var count =$(zanBtnId).html(); $.post('/user/site_message!zan.ds',{"id":zanId},function(data){ if(data.success){ $(zanBtnId).html(parseInt(count)+1); } }); } //最下面的评论 function pl(){ var leave=$('#leaveText').val().trim(); if(leave.length==0){ alert('请输入文字'); return ; } if(leave.length>300){ alert('不能大于300字'); return; } var plId="${websiteMessage.id}"; $.post('/user/site_message!savePL.ds', {"msgId":plId,"leave":leave} ,function(data){ alert(data.message); if(data.success){ var id=data.savePlId; var html="<dl ><dt><img src='/pages/foreground/images/user_image.jpg'></dt><dd><p><span class='c_name'>${loginUser.uname}</span>"; html+="<span class='c_time'> "+da+"</span></p>"; html+="<p class='comment_user'>"+leave+" </p>"; html+="<p class='comment_share'><a onclick='a_huifu(this);' title='"+id+"' href='javascript:void(0);'>回复</a>"; html+="<a onclick='a_zan(this);' title='"+id+"' href='javascript:void(0);'>赞（<label id='labzan_"+id+"'>0</label>）"; html+="</a></p><div id='saydiv"+id+"' class='c_say' style='display:none;'><textarea id='text"+id+"' placeholder='请输入回复...'></textarea>"; html+="<input id='btn_"+id+"' type='button' onclick='huifu(this);' myid='"+id+"' value='回复' title='"+plId+"'></div></dd></dl>"; $('#PLmain').append(html); $('#leaveText').val(''); } }); } </script>
@Resource private MessageBordService messageBordService; @Resource private WebsiteMessageService websiteMessageService; private int pagenum=1;//页数 private int msgnum=1;//留言页数 private Long msgId;//公告的Id private Long parentId;//回复留言的Id private Integer type;//1: 留言 （评论）2:回复 private String leave;//留言(评论)//回复 private MessageBord msg=null; @UnLogin public String index(){ List<WebsiteMessage> webMessages = websiteMessageService.listLateWebMessage(CommonVar.WEBSITEMESSAGE,type); setAttribute("webMessages", webMessages); WebsiteMessage websiteMessage = websiteMessageService.get(id); setAttribute("websiteMessage", websiteMessage); setAttribute("type", type); return "index"; } /*if(value==1) return '媒体报道'; if(value==2) return '网站公告'; if(value==3) return '成功案例'; if(value==4) return '站内信息';*/ @UnLogin public String cgIndex(){ Pager pager=new Pager(); pager.setPageNumber(pagenum); pager.setPageSize(8); DetachedCriteria de=DetachedCriteria.forClass(WebsiteMessage.class); de.add(Restrictions.eq("isDelete", 0)); de.add(Restrictions.eq("mtype", type)); Pager list = websiteMessageService.findByPager(pager, de); setAttribute("webMessages", list); if(null!=id){ WebsiteMessage websiteMessage = websiteMessageService.get(id); setAttribute("websiteMessage", websiteMessage); Set<SystemNoticeWeb> systemNoticeWebs = websiteMessage.getSystemNoticeWebs(); setAttribute("notices", systemNoticeWebs); } setAttribute("type", type); setAttribute("pagenum", pagenum); //获取5留言(评论) if(null!=id){ Pager msgPager=new Pager(); msgPager.setPageNumber(msgnum); msgPager.setPageSize(4);//每页四条数据 DetachedCriteria msgde=DetachedCriteria.forClass(MessageBord.class); msgde.add(Restrictions.eq("websiteMessage",websiteMessageService.get(id))); msgde.add(Restrictions.eq("type", 1)); msgde.add(Restrictions.isNull("parentId")); Pager msgList = messageBordService.findByPager(msgPager, msgde); List<MessageBord> mbs = msgList.getList(); if(mbs!=null&&mbs.size()>=1){ setAttribute("id", id); setAttribute("msgList", msgList);//用于取页数 setAttribute("plNum", mbs.size());//评论条数 getReplay(mbs,id); } Long totalNumber = websiteMessageService.getTotalNumber(Long.valueOf(id)); setAttribute("plNum", totalNumber); } return "index"; } //所有的回复 private void getReplay(List<MessageBord> mbs,Long msgId){ //取出每条评论的回复存入集合 Map<String,List<MessageBord>>map=new HashMap<String,List<MessageBord>>(); for (MessageBord messageBord : mbs) { //获取每条评论 DetachedCriteria hude=DetachedCriteria.forClass(MessageBord.class); hude.add(Restrictions.eq("websiteMessage", websiteMessageService.get(id))); hude.add(Restrictions.eq("type", 2)); hude.add(Restrictions.eq("parentId", messageBord.getId())); List<MessageBord> pls = messageBordService.getL(hude, -1); String key=messageBord.getId().toString(); map.put(key, pls); setAttribute("map", map); } } //保存回复 public void saveReplay(){ try{ msg=new MessageBord(); LoanUser user=(LoanUser) getSession("loginUser"); msg.setLeave(this.leave); msg.setParentId(this.parentId); msg.setType(this.type); msg.setUid(user); msg.setTime(new Date()); msg.setZan(0); msg.setWebsiteMessage(new WebsiteMessage(msgId)); messageBordService.save(msg); super.ajaxJson(DbRecord.jsonShowInfo(true, "留言成功")); }catch (Exception e) { super.ajaxJson(DbRecord.jsonShowInfo(false, "留言失败")); } } //保存评论 public void savePL(){ if(this.leave.length()>300){ super.ajaxJson(DbRecord.jsonShowInfo(false, "不能大于300字")); return; } JSONObject json=new JSONObject(); try{ LoanUser user=(LoanUser) getSession("loginUser"); msg=new MessageBord(); msg.setLeave(this.leave); msg.setTime(new Date()); msg.setType(1); msg.setUid(user); msg.setWebsiteMessage(new WebsiteMessage(msgId)); msg.setZan(0); Long save = messageBordService.save(msg); json.put("success", true); json.put("message", "评论成功"); json.put("savePlId", save); super.ajaxJson(json.toString()); }catch (Exception e) { super.ajaxJson(DbRecord.jsonShowInfo(false, "评论失败")); } } //赞 public void zan(){ try{ if(null!=id){ MessageBord messageBord = messageBordService.get(id); messageBord.setZan((messageBord.getZan()+1)); messageBordService.update(messageBord); super.ajaxJson(DbRecord.jsonShowInfo(true, "赞成功")); } }catch (Exception e) { super.ajaxJson(DbRecord.jsonShowInfo(false, "赞失败")); } }