js分页插件

浏览数：22 / 时间：2015年06月09日

//分页插件
function showView(option) {
        //参数定义id,页容量，当前页，总数，页总数
        var id = option.id,
         pageSize = option.pageSize,
         currentPage = option.currentPage,
         totalCount = option.totalCount,
         pageCount = 0;
        if (Number(pageSize) && Number(totalCount) && Number(currentPage)) {
            pageCount = (parseInt(totalCount / pageSize)) + 1;
            var textHtml = "<span class=‘coseSpan‘ value=‘1‘><a href=‘javascript:;‘>首页</a></span>";
            if (currentPage > 1) {
                textHtml += "<span class=‘coseSpan‘ value = ‘" +(parseInt(currentPage) - 1) + "‘><a href=‘javascript:;‘>上一页</a></span>";
            } else {
                textHtml += "<span class=‘eleSpan‘ value = ‘1‘>上一页</span>";
            }
            if (currentPage < pageCount) {
                textHtml += "<span class=‘coseSpan‘ value = ‘" + (parseInt(currentPage) + 1) + "‘><a href=‘javascript:;‘>下一页</a></span>";
            } else {
                textHtml += "<span class=‘eleSpan‘ value = ‘" +(parseInt(currentPage) + 1) + "‘>下一页</span>";
            }
            textHtml += "<span class = ‘coseSpan‘ value=‘" +parseInt(pageCount) + "‘><a href=‘javascript:;‘>尾页</a></span>";
        }
        //加载页面
        $("#" + id).html(textHtml);
        //注册事件
        $("span .coseSpan").unbind("click").click(function() {
            //获取当前页
            var pageIndex = $(this).attr("value");
            if (pageIndex && Number(pageIndex)) {
                option.getPrassBar(parseInt(pageIndex), pageSize);
            }
        });
    }

//html代码

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="分页插件._Default" %>

<!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 runat="server">
    <title>无标题页</title>

    <script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>

    <script src="js/paging.js" type="text/javascript"></script>

    <script type="text/javascript">
        function loadPage(currentPage,pageSize) {
            showView({
            id: "page",
                pageSize: pageSize,
                currentPage: currentPage,
                totalCount: 0,
                getPrassBar: function(pageIndex, pageSize) {
                alert("页下标:" + pageIndex + "页容量:" + pageSize);
                    loadPage(pageIndex, pageSize);
                }
            });
        }
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input type="button" value="加载分页控件" onclick="loadPage(1,10)" /></div>
    <div>
        <span id="page"></span>
    </div>
    </form>
</body>
</html>