bootstrap 分页控件，实现直接转到某页

最新推荐文章于 2025-06-25 09:09:55 发布

原创最新推荐文章于 2025-06-25 09:09:55 发布 · 3.8k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#bootstrap #分页

PHP 同时被 2 个专栏收录

50 篇文章

订阅专栏

Bootstrap

3 篇文章

订阅专栏

本文介绍了如何在Bootstrap中实现分页控件，并通过PHP和JS事件支持直接跳转到指定页面。利用PHP计算总页数，如$pagecount = ceil($count/$pagesize)；其中ceil函数用于处理除法后向上取整。接着配合JavaScript实现分页导航的交互效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

效果图：

html：

<div class="form-inline">
     <div class="pagination form-group ">
         {$page}
         <span style="border-top-right-radius: 4px;border-bottom-right-radius: 4px;">共{$pagecount}页</span>
         <input class="form-control" style="width: 80px;margin-left: -10px;" 
         	type="text" min="1" max="{$pagecount}" id="pageindex" name="pageindex" placeholder="页码"/>
         <input class="btn btn-danger" type="button" onclick="openPage()" value="确定" />
     </div>
 </div>

php事件：

		$listAll=D("jxkp_djfz_base")->query($sql);
		$count=sizeof($listAll);//数据总量
		$pagesize=2;//分页尺寸
		$page = $this->page($count, $pagesize);//分页控件		
		$this->assign("pagecount",ceil($count/$pagesize));//总量分了多少页，四舍五入
		
		$page->parameter=$_POST;
		$list=D("jxkp_djfz_base")
				->query($sql." limit ". $page->firstRow. ",". $page->listRows);//拼接sql语句
		$this->assign("list",$list);
		
		$this->assign("page", $page->show('Admin'));

js事件：

function openPage(){
	var pageindex=$("#pageindex").val();
	var maxindex=$("#pageindex").attr("max");
	if(isnumber(pageindex)){
		if(parseInt(pageindex)<=parseInt(maxindex)){
			var url=$(".pagination>a:last").attr("href");//获取它下面的地址链接href属性
	         var reg=url.match(/&p=\d*/)[0];//匹配正则表达式，这里可以alert出来看看，防止出现意外。
	         var newurl=url.replace(reg,"&p="pageindex);//替换成新的地址
			document.location.href=newurl;
		}
		else{
			alert("最大页数为"+maxindex);
		}
	}
}

//验证是否是一位数字
function isnumber(data) {
    var regtel = /^[\d]{1,6}$/;
    if (regtel.test(data)) {
        return true;
    }
    else {
        return false;
    }
}

说明：

$pagecount从控制器计算，$this->assign("pagecount",ceil($count/$pagesize));

ceil 是除法加一的运算，只要有余数就加1。