jquery分页插件AmSetPager(自写)(2)


<SPAN><style type="text/css">
.pager a{ text-decoration: none; border: 1px solid #e7ecf0;color: #15B;}
.pager a:hover{ background-color:#E6EBEF}
.pager a,.pager span{display: inline-block;padding: 0.1em 0.4em;margin-right: 5px; margin-bottom: 5px;}
.selectno{background: #26B;color: #fff;border: 1px solid #AAE;}
</style></SPAN>


有三种方式,一个是页面中数据容器有全部数据,这时就是mode:'static'。还有就是ajax按分页方式取数据时,mode:'ajax',还有根据url传参分页mode:'url'(我感觉这时估计不会用到吧)。

首先静态的:

html:

复制代码 代码如下:


<table cellpadding="0" cellspacing="0">
<tr><td><p>1aaaaaaaaaaaaaaaaaaaaaa</p></td></tr>
<tr><td><p>2aaaaaaaaaaaaaaaaaaaaaa</p></td></tr>
<tr><td><p>3aaaaaaaaaaaaaaaaaaaaaa</p></td></tr>
<tr><td><p>4aaaaaaaaaaaaaaaaaaaaaa</p></td></tr>
<tr><td><p>5aaaaaaaaaaaaaaaaaaaaaa</p></td></tr>
<tr><td><p>6aaaaaaaaaaaaaaaaaaaaaa</p></td></tr>
<tr><td><p>7aaaaaaaaaaaaaaaaaaaaaa</p></td></tr>
<tr><td><p>8aaaaaaaaaaaaaaaaaaaaaa</p></td></tr>
<tr><td><p>9aaaaaaaaaaaaaaaaaaaaaa</p></td></tr>
</table>
<div></div>


js代码:

复制代码 代码如下:


$(function(){
$("#tablepager").AmSetPager({"viewCount":2,"mode":"static","listCount":6});
})


这里也可以设置callback,和下面类似

截图:

jquery分页插件AmSetPager(自写)


ajax的:

html:

复制代码 代码如下:


<table cellpadding="0" cellspacing="0">
</table>
<div></div>


后台获取实例数据:

复制代码 代码如下:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdgszz.html