jqPageNavigater - jQuery 分页插件
GPL
跨平台
JavaScript
软件简介
jqPageNavigater
首先要说明的是,这插件本来是写给自己玩的,所以代码质量什么的是很渣的…各位大神别喷呀
这是一个简单的jQuery
分页栏,没有实现很多的功能,样式也很简单,实现自定义比较方便,默认给了几个例子。如果你只是想要一个简单的分页组件,那可能这个就适合你。
如果哪里写得不好,可以改进的地方,欢迎各位大神指导小弟改进
使用:
1. 导入相关文件
<script type="text/javascript" src="../JS/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="../JS/jqPageNavigater.js"></script>
<link rel="stylesheet" type="text/css" href="../CSS/jqPageNavigater.css" />
2.添加一个div作为分页栏容器
<div class="pageNavigater"></div>
3.实现分页
$(".pageNavigater").pageNavigater({
pageNo:'15',//代表当前页码,可以自行更改测试效果
pageSize:'5', //每页展示多少数据
paginationSize:7,//分页导航栏的长度
totalNum:'100', //总共有多少数据
callback:function(pageNo) { //回调函数
alert("this is page"+pageNo);
}
});
样式也很简单,想要什么就自定义。
@CHARSET "UTF-8";
.btn_page{
/*页码样式*/
text-decoration:none;
margin-right: 8px;
}
.current_page{
/*当前页码样式*/
text-decoration:none;
margin-right: 8px;
}
.prevPage{
/*上一页样式*/
}
.lastPage{
/*尾页样式*/
}
.firstPage {
/*首页样式*/
}
.nextPage{
/*下一页样式*/
}