<p>pager.js内容:</p>
<p><textarea cols="91" rows="15" name="code" class="javascript">var _START_, _END_; //pager容器中当前最大值与最小值
var _PageIndex_; //当前页码数值
var _pageTotal = 26; //共106页
var _pagerContent = 6; //pager容量10页
var PagerCss = "style=/"text-decoration:none; background:#ccddee; margin-left:5px; border:sloid 1px #ff3300; padding:5px 10px; line-height:20px;float:left;/"";
var pagerHtml = "";
_START_ = 1;
_END_ = _pagerContent;
function goBack() {
if (_END_ - _START_ < _pagerContent - 1) {
_START_ -= _pagerContent;
_END_ = _START_ + _pagerContent - 1;
} else {
_START_ -= _pagerContent;
_END_ -= _pagerContent;
}
_PageIndex_ = _START_;
SetCss();
pageClick(_PageIndex_, false);
}
function SetCss() {
if (_START_ == 1 && _END_ == _pageTotal) {
$("#btnBack").attr("disabled", true);
$("#btnNext").attr("disabled", true);
} else {
if (_START_ == 1) {
$("#btnBack").attr("disabled", true);
$("#btnNext").attr("disabled", false);
}
if (_END_ == _pageTotal) {
$("#btnBack").attr("disabled", false);
$("#btnNext").attr("disabled", true);
} if (_START_ != 1 && _END_ != _pageTotal) {
$("#btnBack").attr("disabled", false);
$("#btnNext").attr("disabled", false);
}
}
}
function btnBack_onclick() {
goBack();
CreatePagerHtml();
}
function CreatePagerHtml() {
pagerHtml = "";
if (_END_ > _pageTotal) {
_END_ = _pageTotal;
}
for (var i = _START_; i <= _END_; i++) {
pagerHtml += "<a href="/" mce_href="/""#/" onclick=/"pageClick(this,true)/"" + PagerCss + ">" + i + "</a>";
}
$("#pager").html(pagerHtml);
}
function btnNext_onclick() {
goNext();
CreatePagerHtml();
}
function goNext() {
_START_ += _pagerContent;
if (_END_ + _pagerContent > _pageTotal) {
_END_ = _pageTotal;
} else {
_END_ += _pagerContent;
}
_PageIndex_ = _START_;
SetCss();
pageClick(_PageIndex_, false);
}
function pageClick(pageIndex, isNumber) {
if (isNumber == true) {
alert($(pageIndex).html());
} else {
alert(pageIndex);
}
}
$(function () {
$("#btnBack").attr("disabled", true);
_PageIndex_ = 1;
CreatePagerHtml();
pageClick(_PageIndex_);
});</textarea></p>
<p>html页面内容</p>
<p><textarea cols="90" rows="15" name="code" class="xhtml"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<mce:script src="Scripts/jquery-1.4.1.js" mce_src="Scripts/jquery-1.4.1.js" type="text/javascript"></mce:script>
<mce:script src="Pager.js" mce_src="Pager.js" type="text/javascript"></mce:script>
</head>
<body>
<div>
<a href="#" mce_href="#" id="btnBack"onclick="return btnBack_onclick()" style="text-decoration:none; background:#ccddee; margin-left:5px; border:sloid 1px #ff3300; padding:5px 10px; line-height:20px;float:left;" mce_style="text-decoration:none; background:#ccddee; margin-left:5px; border:sloid 1px #ff3300; padding:5px 10px; line-height:20px;float:left;" ><<</a>
<div id="pager" style="float:left;" mce_style="float:left;" ></div>
<a href="#" mce_href="#" id="btnNext"onclick="return btnNext_onclick()" style="text-decoration:none; background:#ccddee; margin-left:5px; border:sloid 1px #ff3300; padding:5px 10px; line-height:20px;float:left;" mce_style="text-decoration:none; background:#ccddee; margin-left:5px; border:sloid 1px #ff3300; padding:5px 10px; line-height:20px;float:left;" >>></a>
</div>
</body>
</html>
</textarea></p>
分享到:
相关推荐
javascript 分页
纯javaScript做的分页,有需要的可以看看,有源代码。
javascript分页模块 实现静态页分页效果如下,只传Page=N就可以了 index.html?Page=4
一个通用的JavaScript分页
javascript分页控件,包含一个别人写的不是javascript的分页控件
经典JavaScript分页代码
laypage - 多功能JavaScript分页组件v1.3 更新日志: 1. 修复当pages(总页数)为0时,仍然输出了【下一页】的bug 2. 修复当不满足出现分页条件时,抛出了Cannot read property 'children' of null的bug 3. 将...
javascript分页(页码生成)
轻松实现javascript分页,<!doctype html public "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ...
豆瓣网站javascript分页原形,适合中低手学习!
10种JavaScript分页代码.rar
自己做的JAVASCRIPT分页控件,这个CS源代码文件文件
PHP分页类,样式可以自定义、支持javascript分页、各种框架使用均可配置 $pageNo = isset($_REQUEST['pageNo']) ? intval($_REQUEST['pageNo']) : 1; $paginator = new paginator(18, 2, $pageNo); $paginator->...
javascript分页,有十多种效果....
一个非常好用的分页显示数据器(javascript编写) 支持排序电击操作,可自定义电击事件方法
JavaScript 分页 在后台用Ajax 与服务器交换数据,不用页面跳转
javascript分页控件,一个是用javascript写的,一个是别人写的。
A simple javascript native pagination plugin 一个原生的javascript分页插件