<?xml version="1.0" encoding="utf-8"?>
<_AJAX_>
<!-- pagination -->
<_PAGE_><![CDATA[
<ul>
<li>
<a href="#"><span>首页</span></a>
<span><span>首页</span></span>
</li>
<li>
<a href="#"><span>上一页</span></a>
<span><span>上一页</span></span>
</li>
#pageNumFrag#
<li>
<a href="#"><span>下一页</span></a>
<span><span>下一页</span></span>
</li>
<li>
<a href="#"><span>末页</span></a>
<span><span>末页</span></span>
</li>
<li><input type="text" value="#currentPage#" /><input type="button" value="确定" /></li>
</ul>
]]></_PAGE_>
</_AJAX_>
pagination.css：
复制代码 代码如下:
@charset "utf-8";
/* CSS Document */
/* public */
ul li,ol li,dt,dd {list-style:none;}
a:link{
color:#000000;
text-decoration:none;
}
a:visited{
color:#000000;
text-decoration:none;
}
a:hover{
color:#000000;
text-decoration:underline;
}
/* pagination */
.panelBar{
margin-top:12px;
height:26px;
line-height:26px;
}
.panelBar ul{
float:left;
}
.panelBar ul li{
float:left;
}
.disabled{
padding:0 6px;
}
.j-num{
padding:0 4px;
}
.pages
{
margin-top:12px;
float:left;
}
.pagination
{
float:left;
padding-left:50px;
}
.pagination li, .pagination li.hover { padding:0 0 0 5px;}
.pagination a, .pagination li.hover a, .pagination li span { float:left; display:block; padding:0 5px 0 0; text-decoration:none; line-height:23px; background-position:100% -150px;}
.pagination li.selected a{color:red; font-weight:bold;}
.pagination span, .pagination li.hover span { float:left; display:block; height:23px; line-height:23px; cursor:pointer;}
.pagination li .first span, .panelBar li .previous span { padding:0 0 0 10px;}
.pagination li .next span, .panelBar li .last span { padding:0 10px 0 0;}
.pagination li .first span { background:url(images/pagination/pagination_first_a.gif) left 5px no-repeat;}
.pagination li .previous span { background:url(images/pagination/pagination_previous_a.gif) left 5px no-repeat;}
.pagination li .next span { background:url(images/pagination/pagination_next_a.gif) right 5px no-repeat;}
.pagination li .last span { background:url(images/pagination/pagination_last_a.gif) right 5px no-repeat;}
.pagination li .last { margin-right:5px;}
.pagination li.disabled { background:none;}
.pagination li.disabled span, .grid .pagination li.disabled a { background-position:0 100px; cursor:default;}
.pagination li.disabled span span { color:#666;}
.pagination li.disabled .first span { background:url(images/pagination/pagination_first_span.gif) left 5px no-repeat;}
.pagination li.disabled .previous span { background:url(images/pagination/pagination_previous_span.gif) left 5px no-repeat;}
.pagination li.disabled .next span { background:url(images/pagination/pagination_next_span.gif) right 5px no-repeat;}
.pagination li.disabled .last span { background:url(images/pagination/pagination_last_span.gif) right 5px no-repeat;}
.pagination li.disabled .last { margin-right:5px;}
.pagination li.jumpto { padding:2px 2px 0 7px; background-position:0 -200px;}
.pagination li.jumpto .jumptotext { float:left; width:30px; height:15px; padding:1px; border-color:#acaeaf; background:#ffffff; border:1px solid #9999cc;}
.pagination li.jumpto .goto { float:left; display:block; overflow:hidden; width:16px; height:19px; border:0; text-indent:-1000px; background:url(images/pagination/pagination_goto.gif) no-repeat; cursor:pointer;}
我看CSS也头疼，这个是我找一个朋友写的，自己又改了改
接下来讲讲使用方法：
首先 指定自己分页模板的路径 DWZ.init("js/pagination.xml"); 然后调用分页：
复制代码 代码如下: