zoukankan      html  css  js  c++  java
  • layui分页的使用心得

      // 执行页面加载的函数
        loadData(1)
      // 每页条数
        var limit = 5;
        // 渲染页面
        function loadData(curr){
            
            $.ajax({
                type:"post",
                url:'http://192.168.21.163:9974/electricity/device/getHistoryDoorAccess?modId=eb6a4c852f404e998db0901517c3d3d2&modKey=9Jqehjcj3ZRV&pageNo='+ curr +'&pageSize='+limit+'&doorIndex=c7fb6deff77b4eabb1be1709049ae742&startTime=2019-08-24T17%3A00%3A00.000%2B08%3A00&endTime=2019-11-25T22%3A00%3A00.000%2B08%3A00',
                async:true,
                success:function(data){
                    var html = '';
                    var msg = data.data
                    console.log(msg)
                    var list = msg.list
                    for(var i=0;i<list.length;i++){
                        if(!list[i].personDetail){
                            html += '<tr>'+
                                    '<td>'+list[i].doorName+'</td>'+
                                    '<td>'+list[i].personId+'</td>'+
                                    '<td>'+list[i].personName+'</td>'+
                                    '<td>'+''+'</td>'+
                                    '<td>'+list[i].eventTime +'</td>'+
                                '</tr>'
                        }else{
                            html += '<tr>'+
                                    '<td>'+list[i].doorName+'</td>'+
                                    '<td>'+list[i].personId+'</td>'+
                                    '<td>'+list[i].personName+'</td>'+
                                    '<td>'+list[i].personDetail.mobile +'</td>'+
                                    '<td>'+list[i].eventTime +'</td>'+
                                '</tr>'
                        }
                    }
                $('#tbody').empty().html(html) 
                    laypage(msg)    
                }
            });
    }
        // 开启分页
        function laypage(msg){
                    layui.use(['laypage', 'layer'], function(){
                    var laypage = layui.laypage
                    ,layer = layui.layer;
                        var pages = msg.total;     
                        //调用分页
                        laypage.render({
                            elem: 'page1'
                            ,count: pages
                            ,limit: limit
                            ,curr: msg.pageNo
                            ,jump: function(obj,first){
                                if(!first) { //是否首次进入页面
    
                                    loadData(obj.curr);
                                    // var currentPage = obj.curr; //获取点击的页码  
                                    // page = currentPage;
                                    // //点击下一页或其他页码重新请求一次,将参数(当前页码)带过去即可
                                    // loadData();
                                }
                        }
                        });
                    })
            }
  • 相关阅读:
    girdview
    c#中&&,||的应用
    ToString()和Convert.ToString()的区别
    日期格式化
    线程间操作ui
    基于k3cloud做的东西
    格式化金额字段添加千位符
    SQL 分页查询
    xammp 配置虚拟主机
    jQuery事件对象event的属性和方法
  • 原文地址:https://www.cnblogs.com/xinheng/p/11868655.html
Copyright © 2011-2022 走看看