首页 > 代码库 > 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="http://www.mamicode.com/${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="http://www.mamicode.com/${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="http://www.mamicode.com/#">举报</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="http://www.mamicode.com/#">举报</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=http://www.mamicode.com/‘/pages/foreground/images/user_image.jpg‘>";                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=http://www.mamicode.com/‘/pages/foreground/images/user_image.jpg‘>

${loginUser.uname}"; 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=http://www.mamicode.com/‘回复‘ 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=http://www.mamicode.com/=1)>*/    @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, "赞失败"));        }    }

 

html的显示消息和留言板