[备忘]js分页工具...不可重用

用法:

<script type="text/javascript">

function init(params) {
 $("[name='uName']").val(params.userName);
 if (params.treeParam !== undefined) {
  $("[name='treeParam']").val(params.treeParam);
 }
}

//持久化查询条件

function testPaging(pagingObj) {
 var params = pagingObj.paramMap;
 $("[name='uName']").val(params.userName);
}
     createPaging(1, $("#p"), ${paging}, ${paramsToJSON}, $("[name='form1']"), init, testPaging);
 </script>

//---------------代码-----------------

/**
 * 分页对象
 * @param 对象唯一标志
 * @param 对应表单
 * @param 执行分页操作的函数
 * @param 查询参数
 * @return 分页对象
 */
function PagingObj(index, form, executeFunc, paramMap) {
	var _this = this;
	this.index = index;
	this.pageCurrent = 1;	// 当前页数
	this.pageSum = 0;	// 总页数
	this.rowSum = 0;	// 总行数
	this.executeFunc = executeFunc;	// 分页执行函数
	this.paramMap = paramMap;	// 查询条件
	$('<input type="text" style="display:none" />').prependTo(form);	// 取消form表单回车事件
	var current = $('<input type="hidden" name="pageCurrent" />').appendTo(form);	// 当前页数
	/**
	 * 创建分页标签
	 * @param 选择器
	 * @return
	 */
	this.appendPagingTag = function(selector) {
		$(selector).append("<span id=\"firstPage" + this.index + "\" style='color:#00527b' onmouseover='this.style.color=\"#fe7d00\"' onmouseout='this.style.color=\"#00527b\"'>首页</span> " +
				"<span id=\"backPage" + this.index + "\" style='color:#00527b' onmouseover='this.style.color=\"#fe7d00\"' onmouseout='this.style.color=\"#00527b\"'>上一页</span> " +
				"<span id=\"nextPage" + this.index + "\" style='color:#00527b' onmouseover='this.style.color=\"#fe7d00\"' onmouseout='this.style.color=\"#00527b\"'>下一页</span> " +
				"<span id=\"lastPage" + this.index + "\" style='color:#00527b' onmouseover='this.style.color=\"#fe7d00\"' onmouseout='this.style.color=\"#00527b\"'>尾页</span> " +
				"[<span id=\"pageCurrent" + this.index + "\"></span>/<span id=\"pageSum" + this.index + "\"></span>] " +
				"<input id=\"jumpPageInput" + this.index + "\" type=\"text\" size=\"1\" value=\"1\" />  " +
				"<span id=\"jumpPage" + this.index + "\" href=\"#\"><input type='button' class='button' value='转到'/></span>  " +
				"共 [<span id=\"rowSum" + this.index + "\"></span>] 条记录");
		$("#firstPage" + this.index).live("click", function() {_this.firstPage();}).css("cursor", "pointer");
		$("#backPage" + this.index).live("click", function() {_this.backPage();}).css("cursor", "pointer");
		$("#nextPage" + this.index).live("click", function() {_this.nextPage();}).css("cursor", "pointer");
		$("#lastPage" + this.index).live("click", function() {_this.lastPage();}).css("cursor", "pointer");
		$("#jumpPage" + this.index).live("click", function() {_this.jumpPage();}).css("cursor", "pointer");
		// 绑定回车事件
		$('#jumpPageInput' + this.index).bind('keyup', function(event){
			if (event.keyCode=="13"){
				_this.jumpPage();
			}
		});
	};
	/**
	 * 增加样式
	 * @param 样式类型
	 * @return
	 */
	this.addTagStyle = function(styleClass) {
		$("#firstPage" + this.index).addClass(styleClass);
		$("#backPage" + this.index).addClass(styleClass);
		$("#nextPage" + this.index).addClass(styleClass);
		$("#lastPage" + this.index).addClass(styleClass);
		$("#jumpPage" + this.index).addClass(styleClass);
	}
	/**
	 * 删除样式
	 * @param 样式类型
	 * @return
	 */
	this.removeTagStyle = function(styleClass) {
		$("#firstPage" + this.index).removeClass(styleClass);
		$("#backPage" + this.index).removeClass(styleClass);
		$("#nextPage" + this.index).removeClass(styleClass);
		$("#lastPage" + this.index).removeClass(styleClass);
		$("#jumpPage" + this.index).removeClass(styleClass);
	}
	/**
	 * 获得操作标签的jQuery对象
	 * @param 对象数组
	 * @return
	 */
	this.getTags = function() {
		var tags = [$("#firstPage" + this.index), $("#backPage" + this.index), 
		            $("#nextPage" + this.index), $("#lastPage" + this.index), 
		            $("#jumpPage" + this.index)];
		return tags;
	}
	/**
	 * 设置分页对象
	 * @param pagingData
	 * @return
	 */
	this.setPagingObj = function(pagingData) {
		this.pageCurrent = parseInt(pagingData.pageCurrent);
		this.pageSum = parseInt(pagingData.pageSum);
		this.rowSum = parseInt(pagingData.rowSum);
		$("#pageCurrent" + this.index).html(this.pageCurrent + 1);
		$("#pageSum" + this.index).html(this.pageSum);
		$("#rowSum" + this.index).html(this.rowSum);
		$("#jumpPageInput" + this.index).val(this.pageCurrent + 1);
	};
	/**
	 * 下一页
	 * @return
	 */
	this.nextPage = function() {
		if (this.pageCurrent < this.pageSum - 1) {
			this.pageCurrent = this.pageCurrent + 1;
			this.executeFunc(this);
			current.val(this.pageCurrent);
			form.submit();
		}
	};
	/**
	 * 上一页
	 * @return
	 */
	this.backPage = function() {
		if (this.pageCurrent > 0) {
			this.pageCurrent = this.pageCurrent - 1;
			this.executeFunc(this);
			current.val(this.pageCurrent);
			form.submit();
		}
	};
	/**
	 * 首页
	 * @return
	 */
	this.firstPage = function() {
		if (this.pageCurrent > 0) {
			this.pageCurrent = 0;
			this.executeFunc(this);
			current.val(this.pageCurrent);
			form.submit();
		}
	};
	/**
	 * 尾页
	 * @return
	 */
	this.lastPage = function() {
		if (this.pageCurrent < this.pageSum - 1) {
			this.pageCurrent = this.pageSum - 1;
			this.executeFunc(this);
			current.val(this.pageCurrent);
			form.submit();
		}
	};
	/**
	 * 跳页
	 * @return
	 */
	this.jumpPage = function() {
		var reg = /^\d+$/;
		var pageNum = $("#jumpPageInput" + this.index).val();
		if (!reg.test(pageNum)) {
			alert("请输入正整数！");
			$("#jumpPageInput" + this.index).val(parseInt(this.pageCurrent) + 1);
			return;
		}
		//if (parseInt(pageNum) <= this.pageSum && parseInt(pageNum) >= 0) {
		this.pageCurrent = parseInt(pageNum) - 1;
		this.executeFunc(this);
		//}
		//$("#jumpPageInput" + this.index).val(parseInt(this.pageCurrent) + 1);
		current.val(this.pageCurrent);
		form.submit();
	};
	return this;
}

/**
 * 创建分页对象
 * @param 对象唯一标志
 * @param 分页功能显示位置
 * @param 分页对象
 * @param 查询参数
 * @param 对应表单
 * @param 创建分页时的执行函数
 * @param 执行分页操作的函数
 * @return 分页对象
 */
function createPaging(index, local, paging, paramMap, form, initFunc, pagingFunc) {
	if (pagingFunc == undefined || pagingFunc == null) {
		pagingFunc = new Function();
	}
	var Paging = new PagingObj(index, form, pagingFunc, paramMap);
	Paging.appendPagingTag(local);
	Paging.setPagingObj(paging);

	// 绑定回车事件
	form.find("input").bind('keyup', function(event){
		if (event.keyCode=="13"){
			form.submit();
		}
	});

	if (paramMap != undefined && paramMap != null) {
		if (initFunc != undefined && initFunc != null && initFunc instanceof Function) {
			initFunc(paramMap);
		}
	}

	return Paging;
}