jqPaginator ajax异步轻量级分页

html

<div id="plansItemList" class="plans-item-list">  </div>

<div class="text-center margin-top-20">
     <ul class="pagination jq-pagination" id="pagination"> </ul>
</div>

js

// 初始化分页控件
    $.jqPaginator('#pagination', {
        totalPages: 1,
        visiblePages: 5,
        currentPage: 1,
        onPageChange: function (num, type) {
            search(num);
        }
    });

    //分页搜索
    function search(pageIndex){
    $.ajax({ url :urlRootContext + '/Myplan/listMyplan.do? pageIndex='+pageIndex+'&pageSize='+pageSize,
        type : "post",
        dataType : "json",
        success : function(datas) {
            var data=datas.data;
            var str='';
            if(datas.totalPages>0){
                $('#pagination').jqPaginator('option', {
                    totalPages: datas.totalPages//总页数
                });
            }
            if(data.length>0){
                for(var i=0;i<data.length;i++){
                    str+='<div class="plans-item" id="'+data[i].id+'">'
                    str+='<div class="plans-item-inner" >';
                    str+='<div class="plans-item-title">';
                    str+=data[i].plan_name;
                    str+='</div>';
                    str+='<div class="plans-item-sub-title">';
                    str+='<i class="fa fa-clock-o"></i>';
                    str+=data[i].execution_Time;
                    str+='</div>';
                    str+='<div class="plans-item-content">';
                    if(data[i].plan_content.length>50){
                        str+=(data[i].plan_content).substr(0,50)+"...";
                    }else{
                        str+=data[i].plan_content;
                    }
                    str+='</div>';
                    str+=' <div class="row no-mg plans-item-action-zone">';
                    str+='<div class="pull-right">';
                    str+='<a class="plans-action-link" href="javascript:void(0);" onclick="showEditPlanModal(this);"';
                    str+='alt="editPlanLink-'+data[i].id+'" title="编辑">';
                    str+='<i class="fa fa-edit"></i>编辑 </a>&nbsp;&nbsp;';
                    str+='<a class="plans-action-link" href="javascript:void(0);" onclick="showDeleteCurrentPlanModal(this);"';
                    str+='alt="delPlanLink-'+data[i].id+'" title="删除">';
                    str+=' <i class="fa fa-trash-o"></i>删除</a></div></div></div></div>';
                }
                $("#plansItemList").html(str);
            }else{
                $("#plansItemList").html("暂无数据……");
                $('#pagination').jqPaginator('option', {
                    totalPages: 1
                });
            }
        },
        error:function () {
            layer.msg('<i class="icon-volume-1"></i>&nbsp;获取数据失败！');
        }
    });
}   

java

java 后台返回json数据，包含data数据和totalPages总页数数据

有什么疑问，请留言，我看到会回复，有什么改善的地方请不吝指教，谢谢！