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\"></i></a><a
style=\"text-decoration:none\" class=\"ml-5\" onClick='del(this,"+data.results[i].id+")' href=\"javascript:;\" title=\"删除\"><i class=\"Hui-iconfont\"></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语句查询。