加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

bootstrap 分页效果

发布时间:2020-12-17 20:50:47 所属栏目:安全 来源:网络整理
导读:script type="text/javascript" src="js/bootstrap-paginator.js"/script 1.添加相应的js文件 2.获取第一页的所有信息 $.ajax({ type:"get", url:location_url, data:{"id":id,"pageNum":1,"status":status}, success:function(data){if(data!=‘‘){ var in
<script type="text/javascript" src="js/bootstrap-paginator.js"></script>

1.添加相应的js文件

2.获取第一页的所有信息

$.ajax({
  type:"get",  url:location_url,
  data:{"id":id,"pageNum":1,"status":status},  success:function(data){ if(data!=‘‘){   var info = JSON.parse(data);   console.log(info);   if(info.retcode == 0){ //字符拼接 table_msg(info,1); //分页 pageLimit(info,carId,id,status);   }else if(info.retcode == 1){ $("#table_list").append(‘<p style="text-align:center">‘+info.retmsg+‘</p>‘);   }   $(".loading").hide(); }   }
})

3.分页信息

function pageLimit(info,status,method){
   $(‘#pageLimit‘).find("li").remove();
   var pageCount = info.pageCount; //取到pageCount的值(把返回数据转成object类型)
    var currentPage = carId; //得到currentPage
    var options = {
        bootstrapMajorVersion: 3,//版本
        currentPage: currentPage,//当前页数
        totalPages: pageCount,//总页数
        numberOfPages:8,itemTexts: function (type,page,current) {
        	switch (type) {
                case "first":
                    return "首页";
                case "prev":
                    return "上一页";
                case "next":
                    return "下一页";
                case "last":
                    return "末页";
                case "page":
                    return page;
            }
        },onPageClicked: function (event,originalEvent,type,page) {
        	$(".loading").show();
        	$("#table_list table").remove();
			$("#pageLimit>li").remove();
			
            $.ajax({
                type:"get",url:location_url,data:{"id":id,"pageNum":page,success: function (data1) {
                    if (data1 != null) {
                        var info = JSON.parse(data1);
			//字符拼接
			table_msg(info,page);
			$(".loading").hide();
                    }
                }
            });
		}
    };
    $(‘#pageLimit‘).bootstrapPaginator(options);
}

4.html

<div id="example" style="text-align: center"><ul id="pageLimit"></ul></div>

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读