jq的分页插件(pagination.min.js)

首先引入jq,再引pagination.min.js和pagination.css

html:

<div id="pagingmix" class="page m-style M-box3">

</div>

js:

function laodPage(pages,alen){
    $(".M-box3").whjPaging({
        totalSize: alen,
        totalPage: pages,
        callBack: function (currPage, pageSize) {
            //回调函数传参
             //searchArchivesInfo(currPage, pageSize);
           console.log(‘currPage:‘ + currPage + ‘     pageSize:‘ + pageSize);
        }
    });
}

pagination.min.js

/**
 * @version: v1.7
 * @author: xgc-whj
 * @date: 2018-05-25 21:40:00
 * @license: MIT license release
 * @jq22 address: http://www.jq22.com/jquery-info17548
 * @GitHub: https://github.com/w0624/jquery-pagination
 * @description: jQuery分页插件,可自定义样式,默认有五套样式,可自定义插件选项,简单方便,兼容IE8
 */
(function(){$.fn.extend({whjPaging:function(b,r){var g=$(this);if(b==="getPage"){return{totalSize:g.get(0).pageText.totalSize,currPage:g.get(0).pageText.staticCurrPage,pageSize:g.get(0).pageText.staticPageSize,totalPage:g.get(0).pageText.staticTotalPage}}else{if(b==="setPage"){g.get(0).pageText.currPage=r.currPage!=null?r.currPage:null;g.get(0).pageText.totalPage=r.totalPage!=null?r.totalPage:null;g.get(0).pageText.totalSize=r.totalSize!=null?r.totalSize:null;if(g.get(0).pageText.isShowPageSizeOpt){c()}}else{if(b!=null){var o=[{value:20,text:"20条/页",selected:true},{value:100,text:"100条/页"},{value:500,text:"500条/页"},{value:1000,text:"1000条/页"}];if(b.pageSizeOpt!=null){o=b.pageSizeOpt}var s=o[0].value;var x=o.length;for(var m=0;m<x;m++){if(o[m].selected){s=o[m].value;break}if(m+1==x){o[0].selected=true}}var d="whj_jqueryPaginationCss-1";if(b.css!=null){switch(b.css){case"css-1":d="whj_jqueryPaginationCss-1";break;case"css-2":d="whj_jqueryPaginationCss-2";break;case"css-3":d="whj_jqueryPaginationCss-3";break;case"css-4":d="whj_jqueryPaginationCss-4";break;case"css-5":d="whj_jqueryPaginationCss-5";break;default:d=b.css;break}}g.get(0).pageText={css:d,pageSizeOpt:o,totalPage:b.totalPage!=null?b.totalPage:null,showPageNum:b.showPageNum!=null?b.showPageNum:5,firstPage:b.firstPage!=null?b.firstPage:"首页",previousPage:b.previousPage!=null?b.previousPage:"上一页",nextPage:b.nextPage!=null?b.nextPage:"下一页",lastPage:b.lastPage!=null?b.lastPage:"尾页",skip:b.skip!=null?b.skip:"跳至",confirm:b.confirm!=null?b.confirm:"确认",refresh:b.refresh!=null?b.refresh:"刷新",totalPageText:b.totalPageText!=null?b.totalPageText:"共{}页",isShowFL:b.isShowFL===false?false:true,isShowPageSizeOpt:b.isShowPageSizeOpt===false?false:true,isShowSkip:b.isShowSkip===false?false:true,isShowRefresh:b.isShowRefresh===false?false:true,isShowTotalPage:b.isShowTotalPage===false?false:true,isResetPage:b.isResetPage===true?true:false,callBack:b.callBack,currPage:1,pageSize:b.isShowPageSizeOpt===false?null:s,totalSize:b.totalSize!=null?b.totalSize:null,isShowTotalSize:b.isShowTotalSize===false?false:true,totalSizeText:b.totalSizeText!=null?b.totalSizeText:"共{}条记录"}}}}if(g.get(0).pageText.totalPage==null||g.get(0).pageText.totalPage<1){g.empty();return}if(g.get(0).pageText.currPage<1){g.get(0).pageText.currPage=1}else{if(g.get(0).pageText.currPage>g.get(0).pageText.totalPage){g.get(0).pageText.currPage=g.get(0).pageText.totalPage}}g.get(0).pageText.staticCurrPage=g.get(0).pageText.currPage;g.get(0).pageText.staticPageSize=g.get(0).pageText.pageSize;g.get(0).pageText.staticTotalPage=g.get(0).pageText.totalPage;var h=g.get(0).pageText.currPage<2?"whj_hoverDisable":"whj_hover";var e=g.get(0).pageText.currPage>=g.get(0).pageText.totalPage?"whj_hoverDisable":"whj_hover";var q=0;var f=0;var y=parseInt(g.get(0).pageText.showPageNum/2);if(g.get(0).pageText.showPageNum<2){f=g.get(0).pageText.currPage}else{if(g.get(0).pageText.totalPage<=g.get(0).pageText.showPageNum){f=1}else{if(g.get(0).pageText.currPage+y>g.get(0).pageText.totalPage){f=g.get(0).pageText.totalPage-g.get(0).pageText.showPageNum+1}else{if(g.get(0).pageText.currPage-y<1){f=1}else{f=g.get(0).pageText.currPage-y}}}}var t=‘<div class="‘+g.get(0).pageText.css+‘">‘;if(g.get(0).pageText.isShowFL){t+=‘<div class="whj_border whj_padding whj_bgc ‘+h+‘" name="whj_firstPage">‘+g.get(0).pageText.firstPage+"</div>"}t+=‘<div class="whj_border whj_padding whj_bgc ‘+h+‘" name="whj_previousPage">‘+g.get(0).pageText.previousPage+"</div>";if(g.get(0).pageText.showPageNum>0){for(var n=f;n<=g.get(0).pageText.totalPage;n++){q++;var v=g.get(0).pageText.currPage==n?"whj_checked":"whj_hover";t+=‘<div class="whj_border whj_padding whj_bgc ‘+v+‘" name="whj_page" data-page="‘+n+‘">‘+n+"</div>";if(q>=g.get(0).pageText.showPageNum){break}}}t+=‘<div class="whj_border whj_padding whj_bgc ‘+e+‘" name="whj_nextPage">‘+g.get(0).pageText.nextPage+"</div>";if(g.get(0).pageText.isShowFL){t+=‘<div class="whj_border whj_padding whj_bgc ‘+e+‘" name="whj_lastPage">‘+g.get(0).pageText.lastPage+"</div>"}if(g.get(0).pageText.isShowPageSizeOpt){t+=‘<select class="whj_border whj_bgc whj_hover" name="whj_pageSize">‘;for(var w in g.get(0).pageText.pageSizeOpt){var j=g.get(0).pageText.pageSizeOpt[w].selected?"selected":"";t+=‘<option value="‘+g.get(0).pageText.pageSizeOpt[w].value+‘" ‘+j+">"+g.get(0).pageText.pageSizeOpt[w].text+"</option>"}t+="</select>"}if(g.get(0).pageText.isShowSkip){t+=‘<div class="whj_padding whj_color">‘+g.get(0).pageText.skip+‘</div><input type="text" class="whj_border whj_color" name="whj_toPage"/><div class="whj_border whj_padding whj_bgc whj_hover" name="whj_confirm">‘+g.get(0).pageText.confirm+"</div>"}if(g.get(0).pageText.isShowRefresh){t+=‘<div class="whj_border whj_padding whj_bgc whj_hover" name="whj_refresh">‘+g.get(0).pageText.refresh+"</div>"}if(g.get(0).pageText.isShowTotalPage){var p=g.get(0).pageText.totalPageText.replace("{}",g.get(0).pageText.totalPage);t+=‘<div class="whj_padding whj_color">‘+p+"</div>"}if(g.get(0).pageText.isShowTotalSize){var a=g.get(0).pageText.isShowTotalPage?"whj_totalSizeSingle":"";var l=g.get(0).pageText.totalSizeText.replace("{}",g.get(0).pageText.totalSize);t+=‘<div class="whj_padding whj_color ‘+a+‘">‘+l+"</div>"}t+="</div>";g.html(t);if(g.get(0).pageText.isShowFL){if(h=="whj_hover"){g.find("div[name=‘whj_firstPage‘]").click(function(){if(g.get(0).pageText.isResetPage){g.get(0).pageText.pageSize=g.get(0).pageText.staticPageSize}g.get(0).pageText.currPage=1;u()})}if(e=="whj_hover"){g.find("div[name=‘whj_lastPage‘]").click(function(){if(g.get(0).pageText.isResetPage){g.get(0).pageText.pageSize=g.get(0).pageText.staticPageSize;g.get(0).pageText.currPage=g.get(0).pageText.staticTotalPage}else{g.get(0).pageText.currPage=g.get(0).pageText.totalPage}u()})}}if(h=="whj_hover"){g.find("div[name=‘whj_previousPage‘]").click(function(){if(g.get(0).pageText.isResetPage){g.get(0).pageText.pageSize=g.get(0).pageText.staticPageSize;g.get(0).pageText.currPage=g.get(0).pageText.staticCurrPage-1}else{g.get(0).pageText.currPage=g.get(0).pageText.currPage-1}u()})}if(e=="whj_hover"){g.find("div[name=‘whj_nextPage‘]").click(function(){if(g.get(0).pageText.isResetPage){g.get(0).pageText.pageSize=g.get(0).pageText.staticPageSize;g.get(0).pageText.currPage=g.get(0).pageText.staticCurrPage+1}else{g.get(0).pageText.currPage=g.get(0).pageText.currPage+1}u()})}if(g.find("div[name=‘whj_page‘]").length>0){g.find("div[name=‘whj_page‘]").click(function(){if(!$(this).hasClass("whj_checked")){if(g.get(0).pageText.isResetPage){g.get(0).pageText.pageSize=g.get(0).pageText.staticPageSize}g.get(0).pageText.currPage=+$(this).data("page");u()}})}if(g.get(0).pageText.isShowPageSizeOpt){g.find("select[name=‘whj_pageSize‘]").change(function(){var i=+$(this).val();if(g.get(0).pageText.isResetPage){$(this).find("option[value=‘"+g.get(0).pageText.staticPageSize+"‘]").prop("selected",true)}var k=parseInt(g.get(0).pageText.totalSize/i);if(k*i<g.get(0).pageText.totalSize){k++}g.get(0).pageText.currPage=1;g.get(0).pageText.pageSize=i;g.get(0).pageText.totalPage=k;if(!g.get(0).pageText.isResetPage){c()}u()})}if(g.get(0).pageText.isShowSkip){g.find("input[name=‘whj_toPage‘]").on("input",function(){var k=$(this).val();var i=$(this).val().replace(/\D/g,"");if(k.length!=i.length){$(this).val(i)}});g.find("div[name=‘whj_confirm‘]").click(function(){var i=g.find("input[name=‘whj_toPage‘]").val();if(i.length>0){i=+i;if(i<1){i=1}else{if(i>g.get(0).pageText.totalPage){i=g.get(0).pageText.totalPage}}if(g.get(0).pageText.isResetPage){g.get(0).pageText.pageSize=g.get(0).pageText.staticPageSize}g.get(0).pageText.currPage=i;u()}})}if(g.get(0).pageText.isShowRefresh){g.find("div[name=‘whj_refresh‘]").click(function(){if(g.get(0).pageText.isResetPage){g.get(0).pageText.pageSize=g.get(0).pageText.staticPageSize;g.get(0).pageText.currPage=g.get(0).pageText.staticCurrPage}u()})}function u(){if(!g.get(0).pageText.isResetPage){g.whjPaging()}g.get(0).pageText.callBack(g.get(0).pageText.currPage,g.get(0).pageText.pageSize)}function c(){var k=[];var z=g.get(0).pageText.pageSizeOpt;for(var i in z){if(z[i].value==g.get(0).pageText.pageSize){k.push({value:z[i].value,text:z[i].text,selected:true})}else{k.push({value:z[i].value,text:z[i].text})}}g.get(0).pageText.pageSizeOpt=k}}})})();

pagination.css

@charset "UTF-8";

/**
 * @version: v1.7
 * @author: xgc-whj
 * @date: 2018-05-25 21:40:00
 * @license: MIT license release
 * @jq22 address: http://www.jq22.com/jquery-info17548
 * @GitHub: https://github.com/w0624/jquery-pagination
 * @description: jQuery分页插件,可自定义样式,默认有五套样式,可自定义插件选项,简单方便,兼容IE8
 */

/*ccs-1*/
.whj_jqueryPaginationCss-1 {
    display: inline-block;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.whj_jqueryPaginationCss-1 div {
    display: inline-block;
    vertical-align: bottom;
    height: 24px;
    line-height: 24px;
}

.whj_jqueryPaginationCss-1 .whj_padding {
    padding: 1px 9px;
}

.whj_jqueryPaginationCss-1 .whj_bgc {
    background-color: #fff;
    color: #698ca9;
}

.whj_jqueryPaginationCss-1 .whj_border {
    border: 1px solid #5b9fd6;
}

.whj_jqueryPaginationCss-1 .whj_color {
    color: #698ca9;
}

.whj_jqueryPaginationCss-1 .whj_hover:hover {
    background-color: #d4f1ff;
    color: #698ca9;
    cursor: pointer;
}

.whj_jqueryPaginationCss-1 .whj_checked {
    background-color: #d4f1ff;
    color: #698ca9;
}

.whj_jqueryPaginationCss-1 .whj_hoverDisable {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.whj_jqueryPaginationCss-1 select {
    height: 28px;
    vertical-align: bottom;
    padding: 0px;
    outline: none;
}

.whj_jqueryPaginationCss-1 input {
    padding: 0px;
    height: 26px;
    outline: none;
    text-align: center;
    width: 60px;
    vertical-align: bottom;
}

.whj_jqueryPaginationCss-1 div, .whj_jqueryPaginationCss-1 input, .whj_jqueryPaginationCss-1 select {
    margin: 2px;
}

/*只有设置显示总页数时,该样式才生效*/
.whj_jqueryPaginationCss-1 .whj_totalSizeSingle {
    margin-left: -8px;
}

/*ccs-2*/
.whj_jqueryPaginationCss-2 {
    display: inline-block;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.whj_jqueryPaginationCss-2 div {
    display: inline-block;
    vertical-align: bottom;
    height: 24px;
    line-height: 24px;
}

.whj_jqueryPaginationCss-2 .whj_padding {
    padding: 1px 9px;
}

.whj_jqueryPaginationCss-2 .whj_bgc {
    background-color: #5194ca;
    color: #fff;
}

.whj_jqueryPaginationCss-2 .whj_border {
    border: 1px solid #5194ca;
}

.whj_jqueryPaginationCss-2 .whj_color {
    color: #5194ca;
}

.whj_jqueryPaginationCss-2 .whj_hover:hover {
    background-color: #d4f1ff;
    color: #5194ca;
    cursor: pointer;
}

.whj_jqueryPaginationCss-2 .whj_checked {
    background-color: #d4f1ff;
    color: #5194ca;
}

.whj_jqueryPaginationCss-2 .whj_hoverDisable {
    opacity: 0.7;
    filter: alpha(opacity=70);
}

.whj_jqueryPaginationCss-2 select {
    height: 28px;
    vertical-align: bottom;
    padding: 0px;
    outline: none;
}

.whj_jqueryPaginationCss-2 input {
    padding: 0px;
    height: 26px;
    outline: none;
    text-align: center;
    width: 60px;
    vertical-align: bottom;
}

.whj_jqueryPaginationCss-2 div, .whj_jqueryPaginationCss-2 input, .whj_jqueryPaginationCss-2 select {
    margin: 2px;
}

/*只有设置显示总页数时,该样式才生效*/
.whj_jqueryPaginationCss-2 .whj_totalSizeSingle {
    margin-left: -8px;
}

/*ccs-3*/
.whj_jqueryPaginationCss-3 {
    display: inline-block;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.whj_jqueryPaginationCss-3 div {
    display: inline-block;
    vertical-align: bottom;
    height: 24px;
    line-height: 24px;
}

.whj_jqueryPaginationCss-3 .whj_padding {
    padding: 1px 9px;
}

.whj_jqueryPaginationCss-3 .whj_bgc {
    background-color: #7a7b7b;
    color: #fff;
}

.whj_jqueryPaginationCss-3 .whj_border {
    border: 1px solid #929292;
}

.whj_jqueryPaginationCss-3 .whj_color {
    color: #929292;
}

.whj_jqueryPaginationCss-3 .whj_hover:hover {
    background-color: #e0dddd;
    color: #7a7b7b;
    cursor: pointer;
}

.whj_jqueryPaginationCss-3 .whj_checked {
    background-color: #e0dddd;
    color: #7a7b7b;
}

.whj_jqueryPaginationCss-3 .whj_hoverDisable {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.whj_jqueryPaginationCss-3 select {
    height: 28px;
    vertical-align: bottom;
    padding: 0px;
    outline: none;
}

.whj_jqueryPaginationCss-3 input {
    padding: 0px;
    height: 26px;
    outline: none;
    text-align: center;
    width: 60px;
    vertical-align: bottom;
}

.whj_jqueryPaginationCss-3 div, .whj_jqueryPaginationCss-3 input, .whj_jqueryPaginationCss-3 select {
    margin: 2px;
}

/*只有设置显示总页数时,该样式才生效*/
.whj_jqueryPaginationCss-3 .whj_totalSizeSingle {
    margin-left: -8px;
}

/*ccs-4*/
.whj_jqueryPaginationCss-4 {
    display: inline-block;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.whj_jqueryPaginationCss-4 div {
    display: inline-block;
    vertical-align: bottom;
    height: 24px;
    line-height: 24px;
}

.whj_jqueryPaginationCss-4 .whj_padding {
    padding: 1px 9px;
}

.whj_jqueryPaginationCss-4 .whj_bgc {
    background-color: #f5f5f5;
    color: #907272;
}

.whj_jqueryPaginationCss-4 .whj_border {
    border: 1px solid #907272;
}

.whj_jqueryPaginationCss-4 .whj_color {
    color: #907272;
}

.whj_jqueryPaginationCss-4 .whj_hover:hover {
    background-color: #afacac;
    color: #fff;
    cursor: pointer;
}

.whj_jqueryPaginationCss-4 .whj_checked {
    background-color: #afacac;
    color: #fff;
}

.whj_jqueryPaginationCss-4 .whj_hoverDisable {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.whj_jqueryPaginationCss-4 select {
    height: 28px;
    vertical-align: bottom;
    padding: 0px;
    outline: none;
}

.whj_jqueryPaginationCss-4 input {
    padding: 0px;
    height: 26px;
    outline: none;
    text-align: center;
    width: 60px;
    vertical-align: bottom;
}

.whj_jqueryPaginationCss-4 div, .whj_jqueryPaginationCss-4 input, .whj_jqueryPaginationCss-4 select {
    margin: 2px;
}

/*只有设置显示总页数时,该样式才生效*/
.whj_jqueryPaginationCss-4 .whj_totalSizeSingle {
    margin-left: -8px;
}

/*ccs-5*/
.whj_jqueryPaginationCss-5 {
    display: inline-block;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.whj_jqueryPaginationCss-5 div {
    display: inline-block;
    vertical-align: bottom;
    height: 24px;
    line-height: 24px;
}

.whj_jqueryPaginationCss-5 .whj_padding {
    padding: 1px 9px;
}

.whj_jqueryPaginationCss-5 .whj_bgc {
    background-color: #199eaf;
    color: #fff;
}

.whj_jqueryPaginationCss-5 .whj_border {
    border: 1px solid #199eaf;
}

.whj_jqueryPaginationCss-5 .whj_color {
    color: #199eaf;
}

.whj_jqueryPaginationCss-5 .whj_hover:hover {
    background-color: #d4f1ff;
    color: #199eaf;
    cursor: pointer;
}

.whj_jqueryPaginationCss-5 .whj_checked {
    background-color: #d4f1ff;
    color: #199eaf;
}

.whj_jqueryPaginationCss-5 .whj_hoverDisable {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.whj_jqueryPaginationCss-5 select {
    height: 28px;
    vertical-align: bottom;
    padding: 0px;
    outline: none;
}

.whj_jqueryPaginationCss-5 input {
    padding: 0px;
    height: 26px;
    outline: none;
    text-align: center;
    width: 60px;
    vertical-align: bottom;
}

.whj_jqueryPaginationCss-5 div, .whj_jqueryPaginationCss-5 input, .whj_jqueryPaginationCss-5 select {
    margin: 2px;
}

/*只有设置显示总页数时,该样式才生效*/
.whj_jqueryPaginationCss-5 .whj_totalSizeSingle {
    margin-left: -8px;
}

完整的案例:(仅供参考不能运行)

onclick="searchArchivesInfo(1,20)//html页面定义一个点击事件传递固定参数1:表示从第一也开始;20:表示一页显示20条数据。该参数随自己的项目而定
/*
 *分页
 */
function laodPage(pages,alen){
    $(".M-box3").whjPaging({
        totalSize: alen,
        totalPage: pages,
        callBack: function (currPage, pageSize) {
            //回调函数传参
            searchArchivesInfo(currPage, pageSize);
           // console.log(‘currPage:‘ + currPage + ‘     pageSize:‘ + pageSize);
        }
    });
}
function searchArchivesInfo(currPage,pageSize){//回调函数接收的形参
    var beginNum=$("#beginArchivesNum").val();
    var endNum=$("#endArchivesNum").val();
    var le=beginNum.length;
    var enle=endNum.length;
    var dates=beginNum.substring(11,15);//2016
    var datee=endNum.substring(11,15);//2016
    var dnbs=beginNum.substring(16,22);//000185
    var dndee=endNum.substring(16,22);//000185
    var stnu=beginNum.substring(11,22).replace("-","");//2016000185
    var ennu=endNum.substring(11,22).replace("-","");
    var subtract=ennu-stnu;
    var qsfor=beginNum.substring(0,4)//J063
    var jsfor=endNum.substring(0,4)//J063
    var qsfiv=beginNum.substring(5,10)//BDC02
    var jsfiv=endNum.substring(5,10)//BDC02
    var zheng =/^[0-9A-Z]+$/;
    if(!zheng.test(qsfor) && !zheng.test(jsfor) && !zheng.test(qsfiv) && !zheng.test(jsfiv) && qsfor.length==4 && jsfor.length==4 && qsfiv.length==5 && jsfiv.length==5){
        alert("输入正确的档案号!");
        return;
    }
    $("#allcheck").prop(‘checked‘,false);
    $(".dacheck").prop(‘checked‘,false);
    $("#contentTable").html("");
    if(le==22 && enle==22 && subtract>=0 && dates.length==4 && datee.length==4 && dnbs.length==6 && dndee.length==6){
        $.ajax({
            url:"/archives/databusiness/yxgjcx.do",
            type:"post",
            dataType:"json",
            data:{"beginNum":beginNum,"endNum":endNum,"page":currPage,"num":pageSize},
            success:function(result){
                console.log(result);
                var data=result.data;
                if(data!=""){
                    var nums=result.data[0].TOT;//后台返总的数据长度
                    var len=Number(nums);//数字类型
                    for(var i=0;i<result.data.length;i++){
                        var index=pageSize*(currPage-1)+i+1;//编号按数字排序
                        var arch=data[i].ARCHIVESNUM;
                        var id=data[i].ID;
                        $("#contentTable").append("<tr class=‘te‘>" +
                            "<td><input type=‘checkbox‘ name=‘items‘ class=‘dacheck‘ value=‘"+data[i].ID+","+data[i].ARCHIVESNUM+"‘ onclick=‘clickchuange(this,\""+id+","+arch+"\")‘></td>" +
                            /*"<td class=‘agree ‘><p class=‘igees‘ changeId=‘"+data[i].ID+"‘ changeDate=‘"+data[i].ARCHIVESNUM+"‘ class=‘red‘   onclick=‘clickchuange()‘></p></td>"+*/
                            "<td>"+index+"</td>"+
                            "<td>"+data[i].CLANNO+"</td>"+
                            "<td>"+data[i].DIRECTORYNO+"</td>"+
                            "<td>"+data[i].YEAR+"</td>"+
                            "<td>"+data[i].CODE+"</td>"+
                            "<td>"+data[i].NAME+"</td>"+
                            "<td>"+data[i].ADDRESS+"</td>"+
                            "<td></td>"+
                            "<td></td>"+
                            "<td>"+data[i].LANDNO+"</td>"+
                            "<td>"+data[i].USEAREA+"</td>"+
                            "<td>"+data[i].TIME+"</td>"+
                        "</tr>");
                    }
                }else{
                    $("#contentTable").append("<tr><td colspan=‘13‘>无数据!</td></tr>");
                }
                var pages =  Math.ceil(len/pageSize);//总的数据长度除以一页显示的长度等于共多少页
                if(currPage == 1){
                    laodPage(pages,len);//加载分页传参
                }
            },
            error:function(){
                alert("出错了!");
            }
        });
    }else{
        alert("输入正确的档案号并且开始档案号大于等于结束档案号!")
    }

}

原文地址:https://www.cnblogs.com/fanting/p/9684942.html

时间: 2024-10-11 02:46:33

jq的分页插件(pagination.min.js)的相关文章

MVC如何使用开源分页插件shenniu.pager.js

最近比较忙,前期忙公司手机端接口项目,各种开发+调试+发布现在几乎上线无问题了:虽然公司项目忙不过在期间抽空做了两件个人觉得有意义的事情,一者使用aspnetcore开发了个人线上项目(要说线上其实只能ip访问,没有域名哈哈),其架构组成由:aspnetcore1.0.0+redis+ postgressql+TaskMainForm服务,这个项目在后期会开源出来供大家分享学习,站点地址点这里心声网:一者是目前正在做的后台管理框架一叶子,现目前刚好吧js分页插件shenniu.pager.js写

jq.paginator分页插件稍加修改

样式一: 样式二: 此分页功能在jq.paginator分页插件上稍加修改. 必加模板html: <div id="jqPaginator"> <div id=""></div> </div> js: $.jqPaginator('#id', { totalPages: , visiblePages:, pagesize:, onPageChange: function (index) { //此为回调函数,在点击每个

JQuery的分页插件pagination.js

在页面分页的方法: ajax从后台获取数据后在前台进行分页 $.ajax({ type: "POST", url: API_CONFIG.getNews, data: JSON.stringify(params), dataType: "json", contentType: 'application/json;charset=UTF-8', success: function(data) { if(data != null) { if(data.STATUS ==

分页插件jquery.simplePagination.js使用

利用ecshop后台,利用插件更改分页显示样式遇到的问题,由于是利用Ajax获取数据进行页面数据更新?所以出现了以下情况: 初始化页面前 : 分页更新后: 点击后出现了分页插件内容消失, 原因:分页一栏在AJax更新表格里(而插件写在外面,初始化页面显示),更新数据后,重新填充表格,所以分页插件内容没有被插入进去,因而不显示 调取query更新需要返回的内容,只更新table里的数据内容 解决办法: 把分页插件写在Ajax更新数据外面,或写在里面同时更新 把分页栏 <div >{include

jq的“钉”插件--jquery.pin.js

一大早浏览博客园时,看到小鹿同学写了一个jquery.pin.js的使用总结,觉得在日常编码过程中用得上,就随着他的总结看了一下,并自己写了个demo.  常见的,一般浏览网页时右侧有个“回到顶部”的字眼或图片,鼠标往下滑动时,这个“回到顶部”一直在浏览器的同一位置,好像钉在那块一样.往常,碰到这个需求时,我都是用: position: fixed; 代码来实现.看过小鹿同学的博客之后,结合jquery.pin.js的作用,想到确实有那种将某个页面元素钉在某段文本旁边的需求,所以也学习了一下.下

Ajax分页插件Pagination从前台jQuery到后端java总结

前端代码.html var pageSize = 10;//设置每页显示条数 var total;//数据总条数 function pagination() { $("#Pagination").pagination(total, { callback : PageCallback, prev_text : '上一页', next_text : '下一页', items_per_page : pageSize, num_display_entries : 4, //连续分页主体部分显示

前端分页插件pagination

摘要: 最近在开发项目中又用到了前端分页,以前也做过,为了方便以后使用所以将他封装成第三方插件,不依赖任何库.网上已经有很多插件,问什么还要自己造轮子? 自己写的扩展性高 不依赖任何库 作为一次技术沉淀 在线预览:http://baixuexiyang.github.io/pagination/ 项目地址:https://github.com/baixuexiyang/pagination 注意: 后面我还要将自己在开发中写到的插件都总结下分享给大家,如果你喜欢用可以star或者fork,或者你

ajax 分页(jquery分页插件pagination) 小例3

<#macro ajaxPaginte url > <script type="text/javascript"> var PageSize = 10;//每页行数 var IsInit = true;//初始化 var search= function(pageIndex,initFlag) { var url = "${url}"; $.ajax({ type: 'GET', url: url, data: { pageNumber:pa

JQueryPagination分页插件,ajax从struts请求数据

2017-07-16 学完了struts,做了个关于分页的小例子,用到了JQuery分页插件Pagination,先贴下插件下载地址 http://www.jq22.com/jquery-info13734 插件作者对于参数讲解的不够详细,琢磨了半天才明白怎么用,不多说,直接代码 1.客户端(jsp页面) 1 /*这些css为了控制生成的数据和分页的li标签的位置*/ 2 a { 3 text-decoration:none; 4 color:black; 5 font-weight: bold