• js分页


    1、:引包<script src="<%=basePath%>/res/js/page.js"></script>

    2、前台样式:

    <div class="pageBox1"  class="independent-bottom-right" style=" 910px;">
                <ul class="pageDiv clearfix">
        
                </ul>
            <div class="notContent hide">
                无数据
            </div>
            <div class="page" style="margin-top:30px">
                <ul class="pageMenu clearfix ">
                    <li class="firstPage">首页</li>
                    <li class="prevPage "> < </li>
                    <div class="pageObj clearfix">
                        
                    </div>
                    <li class="nextPage "> > </li>
                    <li class="lastPage ">尾页</li>
                    <li class="last " style="font-size: 14px;"><span class="totalPage"></span>页,跳转至 <input type="number" class="keuInput" value="1">
                        <button type="button" class="btnSure">确定</button>
                    </li>
                </ul>
            </div>
        </div>
    <script>
    $(function(){
        var id=<%=request.getParameter("id") %>;
        var str='';
        if(id!=null){
            str='?id='+id;
        }
          
        
        $(".pageBox1").pageFun({  /*在本地服务器上才能访问哦*/
            interFace:"<%=basePath%>/teach/question/listquestionajax1"+str,  /*接口*/
            //interFace:{${classlist}},
            displayCount:9,  /*每页显示总条数*/
            maxPage:5,/*每次最多加载多少页*/
            dataFun:function(data){
                console.log(data);
                var dataHtml = "<ul id='cf'>"+
                    "<li id='ml0'>"+
                        "<div class='user-head'>"+
                            "<div class='user-head-content'>"+
                            "<img src='"+data.userid.img+"' width='120' height='120'>"+
                            "</div>"+
                        "</div>"+
                        "<div class='title-name'>"+
                            "<div class='title-name-top'>"+
                                "<div class='title-name-txt'>"+
                                "<a href='<%=basePath%>/teach/question/page4?id="+data.id+
                                        "' style='font-size: 15px;' target='_blank'>"+ 
                                        "<span style='color: red'>"+data.title+"</span>"+
                                    "</a>"+
                                "</div>"+
                                "<div class='title-forum-first'></div>"+
                            "</div>"+
                            "<div class='title-name-bottom'>"+
                                "<div class='title-name-title'>"+
                                    data.userid.username+
                                    "<span class='title_txt'>发布时间:</span>";
                                    var date=new Date(data.twtime);
                                    var d1=date.getDate();
                                    var y=date.getFullYear();
                                    var m=date.getMonth() + 1;
                                     var time = y+'/'+m+'/'+d1;
                                     dataHtml+=time;  
                                     dataHtml+=
                                    "</div>"+
                                "</div>"+
                            "</div>"+
                        "</li>"+
                "</ul>";
                    return dataHtml;
            },
            pageFun:function(i){
                var pageHtml = '<li class="pageNum">'+i+'</li>';
                    return pageHtml;
            }
        })
    })
    </script>

    后台向前台传递的参数:
        @RequestMapping("/listquestionajax")
        @ResponseBody
        public JSONObject listquestionajax(Integer id) {
            JSONObject jo = new JSONObject();
            Map<String,Object> result=service.listquestionbyid(id);
            jo.put("status",  "ok");
            jo.put("message", "success");
            jo.put("datas", result);
            return jo;
        }

    实现js分页;

    前台日期处理

      var date=new Date(data.twtime);
                                    var d1=date.getDate();
                                    var y=date.getFullYear();
                                    var m=date.getMonth() + 1;
                                     var time = y+'/'+m+'/'+d1;

  • 相关阅读:
    HTML5新增标签,表单及属性
    css3背景属性
    移动端隐藏滚动条
    css3选择符
    Hibernate读书笔记条件查询
    Hibernate读书笔记事件机制
    Hibernate读书笔记SQL查询
    Hibernate读书笔记HQL查询
    Hibernate读书笔记Hibernate知识总结
    Hibernate读书笔记缓存
  • 原文地址:https://www.cnblogs.com/NCL--/p/8065787.html
Copyright © 2020-2023  润新知