展开分类
收起分类

内容分页代码

日期:2014-03-25

浏览次数:114

  经过数天辛苦劳作,终将网页“文章分页代码”调试好。现在把过程整理记录以供分享。
  我们先来看看普通的分页代码。

<%
Set conn = Server.CreateObject("ADODB.Connection")
Strcon = "provider=microsoft.jet.oledb.4.0;data source=" & server.mappath("mdb.mdb")
conn.Open strcon
Set rs = Server.CreateObject("ADODB.Recordset")
Sql = "select * from table order by id desc"
rs.Open sql,conn,1
page=1                                     //设置变里PAGE=1
rs.PageSize = 5                            //每页显示记录数
if Not IsEmpty(Request("Page"))then        //如果PAGE已经初始化...
Page = CInt(Request("Page"))               //接收PAGE并化为数字型赋给PAGE变量
    if Page > rs.PageCount then            //如果接收的页数大于总页数
        rs.AbsolutePage = rs.Pagecount     //设置当前显示页等于最后页
    elseif Page <= 0 then                  //如果PAGE小于等于0
        Page = 1                           //设置PAGE等于第一页
    else                                   //否则
		rs.AbsolutePage = Page	         //如果大于零,显示当前页等于接收的页数	   
    end if
end if
Page = rs.AbsolutePage
%>
<%
for i = 1 to rs.PageSize
if rs.EOF then
Exit For                                   //利用for next 循环依次读出记录
end if
%>

  上面的代码只需要改动Rs.pagesize=5,把5改为你想显示的记录数,比如说改为10那么每页就是显示10页。还需要修改的是select语句,就是你要检索的数据库了。也就是说放到任何一个系统中上面的代码只需很小的改动都可以直接拿过来用。
  然后就是要循环读出记录的显示内容了……如: 

<table width=50 border=1 align=center> 
 <tr> 
 <TD><% = rs("内容") %></td>
 </tr>
</table> 
<%
rs.PageSize
next
%>

  最后,添加“下一页,上一页”的链接:

<% if page <> 1 then %>
<a Href = "test.asp?Page = <% = 1 %>">首页</a>
<a Href = "test.asp?ToPage = <% = ToPage - 1 %>">上一页</a>
<% end if %>
<% if page <> rs.pagecount then %>
<a Href = "test.asp?ToPage = <% = Page + 1 %>">下一页</a>
<a Href = "test.asp?ToPage = <% = rs.PageCount %>">尾页</a>
<% end if %>

  上面的代码反正不管三七二十一只管复制粘贴,只需把“test.asp”改成你自己的文件名就可以了。
  最后,关闭记录集释放资源:

<%
rs.close
Set rs = Nothing
conn.close
Set conn = Nothing
%>

    再来看看目前网站的分页形式:

    1 2 3 4 5 6 7 8 9 10

      而这种分页样式比较全面:

    共分50页 当前第6页 第一页 PREV 1 2 3 4 5 6 7 8 9 10 NEXT 最后一页

      即使这样还是不能直达到指定页,所以普遍在后面又加上“跳转到…页”的功能。如下图所示: 

20140325234618411841.gif

  谷歌和百度的分页样式:

20140325234432363236.gif

20140325234460676067.gif

  他们的分页条都没有跳转的功能(也是啊,最接近搜索结果的信息都在前面,谁去看后面的呢?)。
  这里得赞一下百度的分页样式,简洁清新。大家注意到没,只有他的样式是每个页码框大小一样的(其他的2位数的都比1位数的宽),如果再加上跳转和限位显示就完美了。
  这是“南国佳人”的分页条,看看是怎么做的。 

20140325234789218921.gif

 (由于这个样式兼容性不太好,现已改用其他样式) 

    首先要在编辑文章时要加上分页符号。kindeditor编辑器的分页符在这里修改:

      kindeditorpluginspagebreakpagebreak.js。


      找到这一句

var pagebreakHtml = K.undef(self.pagebreakHtml, 
   (' <hr class="ke-pagebreak" style="page-break-after:always;" />');

  将红色处的字符改为你想要的样式,比如这样“{分页符}”。
  增加样式代码:

20140325233058425834.gif

  在显示文章的页面加入代码:

<% 
arr_Content = split(News_Content,"{分页符}")    //在文章中检索分页符并记录
MaxPages = ubound(arr_Content)                  //得到总数
Response.Write arr_Content(Page - 1)            //总数等于总页码减一
%>

  解释:读取来源网页,对分页符{分页符}进行计数,得到总页码(比如有九个{分页符},就有10页,你懂的)。
  分页源码:  

20140325235948114811.gif

  其中“####”表示(ui-page ui-page);而“**”表示(prev、next、numx、curr、midd)等其中一个,参考之前的样式表,这个你懂的。
  如果需要加上“跳转到……页”的功能:  

2014032500010237237.gif

  剩下就只有限制显示了。修改中间部分的循环代码,将 for pagecounter = 0 to maxpages (将页码从0至最大数循环)改为如下这样:  

num_tail = num_head + 6                  //尾部 = 头部 + 6
if num_head < 1 then num_head = 0             //如果头部 < 1 那么让它 = 0 
if num_tail > MaxPages then num_tail = MaxPages      //如果尾部 > 最大数,就让它 = 最大数
for PageCounter = num_head to num_tail          //显示页码 = 从“头部”至“尾部”

   大功告成!