插件描述：简单好用的jQuery分页插件，拿来添加css样式就可以直接使用
更新时间：2017/12/10 下午6:52:27
更新说明：
1. 增加了一个预设的样式，可以直接拿来使用，可以关闭或开启（默认关闭）。
2. 修复了原来的缺陷，比如 不可以同时用2分页插件、自定义属性占用的问题、预设的点击的页码css样式等
3. 增加了一个min压缩版本，比原版小40%,一行代码加载更快。
4. 增加了大量可预设的属性，可以在HTML全部预设好不必再打开JS文件
Page是一个基于JQ编写的分页插件
开始使用:
1 | $(*).Page({type},class); |
* 写入要插件要出现的HTML容器位置，{type}则是配置属性。比如：
1 | $('body').Page({}); |
会出现body标签位置，并且会清除body内所有内容，calss是预设的css样式只要回执true就可以使用。
兼容性：里面基本没有用到css3的地方，代码全部基于jq编写 使用最新版就好，浏览器兼容 IE 78910 应该都没问题 其他最新就好。
常用配置属性更多查看js文件
1 2 3 4 5 6 7 8 9 | $(".paging").Page({ page:1, // 当前页 默认第一页 pages:false, // 总页数 ！必须配置 否则没有页数 pageNum:5, // 页码数 共显示多少个页码 默认5 建议设置 奇数 比较美观 search:true, // 是否跳转功能 true未开启 false为关闭 默认开启 TopDownpage:true, // 是否开启上一页 下一页功能 true未开启 false为关闭 默认开启 pageOn:false, // 点击页码时触发事件，默认关 建议填写！格式 pageOn:function(e){/* 你要 执行的代码*/} searchOn:false, //点击跳转时触发事件，默认关 建议填写！格式 searchOn:function(e){/* 你要 执行的代码*/}}); |
结构
1 2 3 4 5 6 7 8 9 | <-div-> html 容器 <-ul-> /* 页码区 <-li->页码<-/li-> <-/ul->*/ 页码区结束 <-ul-> /* 跳转区 <-input->输入框 <-input->跳转按钮 <-/ul->*/ 跳转区结束<-/div->html 容器结束 |
运用
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | $(".paging").Page({ Pages: < - ? -php echo(总页数); - ? - > , PageOn : function(e) { $.post(".php", { 传递的页码: e }, function(data) { $(要更新的容器).html(data) } }, JumpOn: function(e) { $.post(".php", { 传递的页码: e }, function(data) { $(要更新的容器).html(data) } }, }, true); |
这样就可以完成一个静态页面的刷新，简单的很~！
详情看 压缩包 内的HTML文件，这是写网站时需要，就写了一个插件，兼容性没有问题，建议使用最新的JQ库。
使用插件只需要导入Js文件后，再添加你的CSS样式就大功告成了！
特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com
- 上一个特效： 页面多板块拖动，调整边缘，吸附效果（原创）
- 下一个特效： bootstrap paginat分页优化