bootstrap 分頁控制元件,實現直接轉到某頁
阿新 • • 發佈:2019-01-28
效果圖:
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。