asp.net中利用Jquery+Ajax+Json實現無刷新分頁的實例代碼

2024-07-10 12:43:53

字體：大中小

來源：轉載

供稿：網友

代碼如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxJson.aspx.cs" Inherits="AjaxJson" %>
<!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>Jquery+Ajax+Json分頁</title>
    <meta http-equiv="content-type" content="text/html; charset=gb2312">
    <link href="Styles/tablecloth.css" rel="stylesheet" type="text/css" />
    <link href="Styles/pagination.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript" src="Scripts/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="Scripts/jquery.pagination.js"></script>
    <script type="text/javascript">
    var pageIndex = 0;     //頁面索引初始值
    var pageSize = 10;     //每頁顯示條數初始化，修改顯示條數，修改這里即可
    $(function () {
        InitTable(0);    //Load事件，初始化表格數據，頁面索引為0（第一頁）
        //分頁，PageCount是總條目數，這是必選參數，其它參數都是可選
        $("#Pagination").pagination(<%=pageCount %>, {
            callback: PageCallback,
            prev_text: '上一頁',       //上一頁按鈕里text
            next_text: '下一頁',       //下一頁按鈕里text
            items_per_page: pageSize, //顯示條數
            num_display_entries: 6,    //連續分頁主體部分分頁條目數
            current_page: pageIndex,   //當前頁索引
            num_edge_entries: 2        //兩側首尾分頁條目數
        });