首页 > 代码库 > Ajax分页js代码

Ajax分页js代码

var pageIndex = 0;var pageSize = 10;$(function () {    $("#btnSearch").click(function () {        var name = $("#txtSearch").val();        pageIndex = 0;        AjaxGetData(name, pageIndex, pageSize);    });    AjaxGetData(name, pageIndex, pageSize);});function AjaxGetData(name, index, size) {    $.ajax({        url: "PageHandler.ashx",        type: "Get",        data: "Name=" + name + "&PageIndex=" + index + "&PageSize=" + size,        dataType: "json",        success: function (data) {            var htmlStr = "";            htmlStr += "<table>"            htmlStr += "<thead>"            htmlStr += "<tr><td>CustomerID</td><td>CompanyName</td><td>ContactName</td><td>ContactTitle</td><td>Address</td><td>City</td></tr>"            htmlStr += "</thead>";            htmlStr += "<tbody>"            for (var i = 0; i < data.Customers.length; i++) {                htmlStr += "<tr>";                htmlStr += "<td>" + data.Customers[i].CustomerID + "</td>"                                  + "<td>" + data.Customers[i].CompanyName + "</td>"                                  + "<td>" + data.Customers[i].ContactName + "</td>"                                  + "<td>" + data.Customers[i].ContactTitle + "</td>"                                  + "<td>" + data.Customers[i].Address + "</td>"                                  + "<td>" + data.Customers[i].City + "</td>"                htmlStr += "</tr>";            }            htmlStr += "</tbody>";            htmlStr += "<tfoot>";            htmlStr += "<tr>";            htmlStr += "<td colspan=‘6‘>";            htmlStr += "<span>共有记录" + data.Count + ";共<span id=‘count‘>" + (data.Count % 10 == 0 ? parseInt(data.Count / 10) : parseInt(data.Count / 10 + 1)) + "</span>页" + "</span>";            htmlStr += "<a href=‘javascript:void‘ onclick=‘GoToFirstPage()‘ id=‘aFirstPage‘ >首    页</a>&nbsp;&nbsp; ";            htmlStr += "<a href=‘javascript:void‘ onclick=‘GoToPrePage()‘ id=‘aPrePage‘ >前一页</a>&nbsp;&nbsp; ";            htmlStr += "<a href=‘javascript:void‘ onclick=‘GoToNextPage()‘ id=‘aNextPage‘>后一页</a>&nbsp;&nbsp; ";            htmlStr += "<a href=‘javascript:void‘ onclick=‘GoToEndPage()‘ id=‘aEndPage‘ >尾    页</a>&nbsp;&nbsp; ";            htmlStr += "<input type=‘text‘ /><input type=‘button‘  value=http://www.mamicode.com/‘跳转‘ onclick=‘GoToAppointPage(this)‘ />";            htmlStr += "</td>";            htmlStr += "</tr>";            htmlStr += "</tfoot>";            htmlStr += "</table>";            $("#divSearchResult").html(htmlStr);        },        error: function (XMLHttpRequest, textStatus, errorThrown) {            $("#divSearchResult").html("未查询到任何项!");        }    });}//首页function GoToFirstPage() {    pageIndex = 0;    AjaxGetData($("#txtSearch").val(), pageIndex, pageSize);}//前一页function GoToPrePage() {    pageIndex -= 1;    pageIndex = pageIndex >= 0 ? pageIndex : 0;    AjaxGetData($("#txtSearch").val(), pageIndex, pageSize);}//后一页function GoToNextPage() {    if (pageIndex + 1 < parseInt($("#count").text())) {        pageIndex += 1;    }    AjaxGetData($("#txtSearch").val(), pageIndex, pageSize);}//尾页function GoToEndPage() {    pageIndex = parseInt($("#count").text()) - 1;    AjaxGetData($("#txtSearch").val(), pageIndex, pageSize);}//跳转function GoToAppointPage(e) {    var page = $(e).prev().val();    if (isNaN(page)) {        alert("请输入数字!");    }    else {        var tempPageIndex = pageIndex;        pageIndex = parseInt($(e).prev().val()) - 1;        if (pageIndex < 0 || pageIndex >= parseInt($("#count").text())) {            pageIndex = tempPageIndex;            alert("请输入有效的页面范围!");        }        else {            AjaxGetData($("#txtSearch").val(), pageIndex, pageSize);        }    }}

 

Ajax分页js代码