首页 > php教程 > php手册 > 正文

带有输入跳转的分页

WBOY
发布: 2016-06-07 11:36:04
原创
1042 人浏览过

第一次发表文章大家多多指教
先发一下效果图吧带有输入跳转的分页


php部分分页配置代码


$module_name = '/' . MODULE_NAME . '/' . CONTROLLER_NAME . '/' . ACTION_NAME;//获取路径

$page->lastSuffix = false; // 最后一页是否显示总页数
$page->setConfig('prev', '上一页');
$page->setConfig('next', '下一页');
$page->setConfig('first', '首页');
$page->setConfig('last', '尾页');
$page->setConfig('theme', ' 共有%TOTAL_ROW%条记录

当前第%NOW_PAGE%页 共有%TOTAL_PAGE%页
%UP_PAGE% %FIRST% %LINK_PAGE% %END% %DOWN_PAGE%
');

jq部分
$(function(){
$('#z').blur(function(){
var url=$('.tiaozhuan').attr("href");
var strs=url.substr(0,25);


var value=this.value;
var all=$('.all').attr("title");
var i=parseFloat(all);//将字符转化成数字

if(value<=i && !isNaN(value) && value>0){
value=Math.ceil(value);
}else{
value='';
}

var newurl=strs value;
$('.tiaozhuan').attr("href",newurl);
});


css部分
.right{float: left;color: #000000;padding: 10px 0 0 50px;}
.za{float: right;padding: 10px 10px 0 0;}

.zi{float: left;padding: 0 5px 0 0;}
.all{float: left;padding: 0 0 0 5px;}
.info{float: right;}
.info input{border:solid #ccc 1px;}
.tiaozhuan{padding: 0 0 0 5px;}
.page{float: left;padding: 0 20px 0 20px;}
.page a{float:left;display:block;margin: 0 1px 0 1px;color: #ffffff}
.current{float:left;display:block;margin: 0 1px 0 1px;background: #aad83e;width: 20px;height: 20px;text-align: center}
.num{background: #2c2c2c;width: 20px;height: 20px;text-align: center}
.prev{width: 60px;height: 20px;background: #8a8787;text-align: center}
.next{width: 60px;height: 20px;background: #8a8787;text-align: center}
.first{width: 40px;height: 20px;background: #8a8787;text-align: center}
.end{width: 40px;height: 20px;background: #8a8787;text-align: center}
css部分建议自己调整一下

AD:真正免费,域名 虚机 企业邮箱=0元

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门推荐
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!