node.js下如何利用jqpaginator插件实现ajax分页

第一步：首先在页面中引入jquery包和jqpaginator插件包。

              例如：<script type="text/javascript" src="/js/jquery-1.11.1.min.js"></script>
                         <script type="text/javascript" src="/jqPaginator/dist/jqpaginator.min.js"></script>

第二步：将共有多少条数据从数据库查出来然后分配到前台页面中。

              query("select count(*) as sum from antcontent",function(err,data){
                     if(!err){
                            res.render('article-list',{sum:data[0].sum});
                     }
              });

第三步：在前台页面接受到后台传来的sum(一共多少条数据)，然后放在隐藏域中。

              < input type="hidden" value="<%= sum %>" id="sum">

第四步：利用jqpaginator插件写ajax代码。

    var sum = $("#sum").val(); //获取共多少条数据
    $('#pagination0').jqPaginator({
        totalPages:Math.ceil(sum/5), //共有多少页
        visiblePages:5, //最多显示几页
        currentPage:1, //当前页
        first: '<li class="first"><a href="javascript:void(0);">First</a></li>',
        prev: '<li class="prev"><a href="javascript:void(0);">Previous</a></li>',
        next: '<li class="next"><a href="javascript:void(0);">Next</a></li>',
        last: '<li class="last"><a href="javascript:void(0);">Last</a></li>',
        page: '<li class="page"><a href="javascript:void(0);">{{page}}</a></li>',
        onPageChange:function(num){  //这里的num 返回的是当前第几页
            $.ajax({
                url:"/admin/ajaxlist",
                type:"post",
                data:{num:num}, //把当前的页数num传到后台
                success:function(data){
                    $("#tab").html("");
                    for(var i=0;i<data.results.length;i++){
                        $("#tab").append("<tr class=\"text-c\"><td><input type=\"checkbox\" value=\"\" name=\"\"></td><td>"+data.results[i].id+"</td><td class=\"text-l\"><u style=\"cursor:pointer\" class=\"text-primary\" title=\"查看\">"+data.results[i].title+"</u></td><td>"+data.results[i].categaryname+"</td><td>"+data.results[i].author+"</td><td>"+data.results[i].source+"</td><td>"+data.results[i].timer+"</td><td><img src=\"/uploads/"+data.results[i].pic+"\" width=\"40\" height=\"40\"></td><td class=\"f-14 td-manage\"><a style=\"text-decoration:none\" class=\"ml-5\" href=\"http://127.0.0.1:3000/admin/article-edit?id="+data.results[i].id+"\" title=\"编辑\"><i class=\"Hui-iconfont\">&#xe6df;</i></a><a style=\"text-decoration:none\" class=\"ml-5\" onClick='del(this,"+data.results[i].id+")' href=\"javascript:;\" title=\"删除\"><i class=\"Hui-iconfont\">&#xe6e2;</i></a></td></tr>");
                    }
                }
            });
        }
    });

第五步、在后台查询数据（/admin/ajaxlist）

    var d = req.body; //接收post提交过来的值

    var num = d.num; //接收前台传过来的当前页数

    //查询出当前页数的数据
    query("select a.id,a.title,a.author,a.timer,a.source,a.pic,b.categaryname from antcontent as a left join antcategary as b on a.cateid = b.id limit ?,?",[(num-1)*5,5],
        function(err,data){
        if(!err){
            console.log(data);
            res.json({results:data}); //再将查询出来的数据返回到页面
        }
    });

注意：这里用到的query()方法是封装好的。如果你没有封装，要写完整的sql语句查询。