主頁(yè) > 知識(shí)庫(kù) > asp.net+ajax簡(jiǎn)單分頁(yè)實(shí)例分析

asp.net+ajax簡(jiǎn)單分頁(yè)實(shí)例分析

熱門(mén)標(biāo)簽:機(jī)器人電銷(xiāo)騙局揭秘 個(gè)人怎樣在百度地圖標(biāo)注地名 硅語(yǔ)電話(huà)機(jī)器人公司 越南河內(nèi)地圖標(biāo)注 ai機(jī)器人電銷(xiāo)資源 地圖標(biāo)注項(xiàng)目怎么樣 騰訊地圖標(biāo)注位置能用多久 云呼外撥網(wǎng)絡(luò)電話(huà)系統(tǒng) 超級(jí)大富翁地圖標(biāo)注

本文實(shí)例講述了asp.net+ajax簡(jiǎn)單分頁(yè)實(shí)現(xiàn)方法。分享給大家供大家參考,具體如下:

這里涉及兩個(gè).aspx文件,一個(gè)叫Default.aspx,一個(gè)叫AjaxOperations.aspx,第一個(gè)用來(lái)顯示一些測(cè)試數(shù)據(jù),后一個(gè)用來(lái)對(duì)分頁(yè)進(jìn)行處理。js文件夾下面還有一個(gè)testJs.js的文件,它就是ajax操作的核心部分。不錯(cuò),code is cheap??创a:

/*testJs.js*/
// 此函數(shù)等價(jià)于document.getElementById /document.all
function $(s) { if (document.getElementById) { return eval('document.getElementById("' + s + '")'); } else { return eval('document.all.' + s); } }
// 創(chuàng)建 XMLHttpRequest對(duì)象,以發(fā)送ajax請(qǐng)求 
function createXMLHTTP() {
 var xmlHttp = false;
 var arrSignatures = ["MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0",
       "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP",
       "Microsoft.XMLHTTP"];
 for (var i = 0; i  arrSignatures.length; i++) {
  try {
   xmlHttp = new ActiveXObject(arrSignatures[i]);
   return xmlHttp;
  }
  catch (oError) {
   xmlHttp = false; //ignore
  }
 }
 // throw new Error("MSXML is not installed on your system."); 
 if (!xmlHttp  typeof XMLHttpRequest != 'undefined') {
  xmlHttp = new XMLHttpRequest();
 }
 return xmlHttp;
}
//window.onload = showPages(1, 10, 100);
//cP目前頁(yè)碼, tP總頁(yè)數(shù) ,tN總記錄數(shù) 
function showPages(cP, tP, tN) {
 //處理頁(yè)碼大于總頁(yè)數(shù) 
 if (cP >= tP) {
  cP = tP;
 }
 //處理頁(yè)碼小于1 
 if (cP  1) {
  cP = 1;
 }
 var trPg = $("trPager");
 var newCellOne = trPg.insertCell(0);
 newCellOne.width = "20%";
 var newCellTwo = trPg.insertCell(1);
 newCellTwo.width = "15%";
 newCellTwo.id = "pgSummary";
 var newCellThree = trPg.insertCell(2);
 newCellThree.width = "45%";
 newCellThree.id = "pgNumContext";
 var newCellFour = trPg.insertCell(3)
 newCellFour.width = "20%";
 newCellTwo.innerHTML = "共span id='totalNum'>" + tN + "/span>項(xiàng) 第span id='cuPgNumber' style='color:red'>" + cP + "/span>/span id='sumPgNumber' >" + tP + "/span>頁(yè)";
 var pageHtml = " a href='#' onclick='gotoPage(1)'>首頁(yè)/a>";
 pageHtml += "a id='prevPg' href='#' onclick='goToNextPrev(-1)'> 上頁(yè) /a>";
 for (var i = 1; i  tP + 1; i++) {
  var numColor = "";
  if (i == 1) numColor = "red";
  pageHtml += "a id='numPg" + i + "' style='color:" + numColor + "' href='#' onclick='gotoPage(" + i + ")'>" + i + " /a>";
 }
 pageHtml += "a id='nextPg' href='#' onclick='goToNextPrev(1)'> 下頁(yè)/a>";
 pageHtml += "a href='#' onclick='gotoPage(" + tP + ")'> 尾頁(yè)/a>";
 pageHtml += "nbsp;input name='pgNumber' type='text' id='pgNumber' size='3' onKeyPress='return handleEnterOnPgNumber();'>nbsp;" +
   "input name='goto' type='button' id='goto' value='go' onClick='forward()'>";
 newCellThree.innerHTML = pageHtml;
}
//構(gòu)造頁(yè)面跳轉(zhuǎn)的js函數(shù),函數(shù)中需要判斷輸入的頁(yè)號(hào)是否是合法的數(shù)值 
function forward() {
 if (!(/^([-]){0,1}([0-9]){1,}$/.test($("pgNumber").value))) {
  //輸入的值不合法 
  alert("請(qǐng)輸入合法的頁(yè)號(hào)!");
  $("pgNumber").focus();
  $("pgNumber").select();
 }
 else
  gotoPage($("pgNumber").value);
}
//處理在跳轉(zhuǎn)頁(yè)面上按下回車(chē)的情況 
function handleEnterOnPgNumber() {
 if (event.keyCode == 13) {
  forward();
  return false;
 }
 return true;
}
function gotoPage(oNum) { // 頁(yè)數(shù)不能為0或者為負(fù)數(shù) (首頁(yè),尾頁(yè))
 if (oNum > 0) {
  var totalNumber = parseInt($("totalNum").innerText); //總記錄數(shù)
  var curPgNumber = parseInt($("cuPgNumber").innerText);
  var totalPgNumber = parseInt($("sumPgNumber").innerText); // 總頁(yè)數(shù)
  if (parseInt(oNum) = totalPgNumber) {
   chgPages(oNum, totalPgNumber, totalNumber);
   for (var k = 1; k  totalPgNumber + 1; k++) {
    $("numPg" + k).style.color = "";
   }
   $("numPg" + oNum).style.color = "red";
   getPagerInfo(oNum);
  }
  else {
   alert("請(qǐng)輸入合法的頁(yè)號(hào)!");
   $("pgNumber").focus();
   $("pgNumber").select();
   return;
  }
 }
}
function goToNextPrev(oNum) {
 var addNum = parseInt(oNum);
 var totalNumber = parseInt($("totalNum").innerText); //總記錄數(shù)
 var curPgNumber = parseInt($("cuPgNumber").innerText);
 var totalPgNumber = parseInt($("sumPgNumber").innerText); // 總頁(yè)數(shù)
 //如果當(dāng)前頁(yè)是第一頁(yè),點(diǎn)擊前一頁(yè)不用刷新 //如果當(dāng)前頁(yè)是最后一頁(yè),點(diǎn)擊下一頁(yè)不用刷新
 if ((curPgNumber + addNum) > 0  (curPgNumber + addNum) = totalPgNumber) {
  chgPages(parseInt(curPgNumber + addNum), totalPgNumber, totalNumber);
  for (var k = 1; k  totalPgNumber + 1; k++) {
   $("numPg" + k).style.color = "";
  }
  $("numPg" + parseInt(curPgNumber + addNum)).style.color = "red";
  getPagerInfo(parseInt(curPgNumber + addNum));
 }
}
function chgPages(cuPg, toPg, tNum) {
 // $("totalNum").innerHTML = tNum;
 $("cuPgNumber").innerHTML = cuPg;
 //$("sumPgNumber").innerHTML = toPg;
}
function getPagerInfo(oNum) { // 處理請(qǐng)求,更新內(nèi)容
 var xmlReq = createXMLHTTP();
 xmlReq.open("post", "/AjaxOperations.aspx?pgNumber=" + oNum, true);
 xmlReq.onreadystatechange = function() {
  if (xmlReq.readyState == 4) {
   if (xmlReq.status == 200) {
    //xmlReq.responseText為輸出的那段字符串
    $("tbTest").innerHTML = xmlReq.responseText;
   }
   else {
    $("tbTest").innerHTML = "  獲取數(shù)據(jù)中,請(qǐng)稍等...";
    //alert("Connect the server failed!");
   }
  }
 }
 xmlReq.send(null);
}

Default.aspx:

%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebTest2008.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">
 script src="js/testJs.js" type="text/javascript">/script>
 style type="text/css">
 A:link
 {
 color: #003399;
 text-decoration: none;
 }
 A:visited
 {
 color: #003366;
 text-decoration: none;
 }
 A:hover
 {
 color: #ff0000;
 text-decoration: underline;
 }
 A:active
 {
 color: #00ff00;
 text-decoration: none;
 }
 /style>
 title>/title>
/head>
body onload="showPages(1, 10, 100)">
 form id="form1" runat="server">
 div>
 div style="text-align: center" id="tbTest">
 第1頁(yè)/div>
 table cellspacing="0" style="width: 100%; height: 30px" border="0" align="center">
 tr id="trPager">
 /tr>
 /table>
 /div>
 /form>
/body>
/html>

Default.aspx.cs:

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebTest2008
{
 public partial class Default : System.Web.UI.Page
 {
  protected void Page_Load(object sender, EventArgs e)
  {
  }
 }
}

AjaxOperations.aspx:

復(fù)制代碼 代碼如下:
%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AjaxOperations.aspx.cs" Inherits="WebTest2008.AjaxOperations" %>

AjaxOperations.aspx.cs:

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebTest2008
{
 public partial class AjaxOperations : System.Web.UI.Page
 {
  protected void Page_Load(object sender, EventArgs e)
  {
   if (!string.IsNullOrEmpty(Request["pgNumber"]))
   {
    //int pgNum = Convert.ToInt32(Request["pgNumber"]);
    Response.Write("第" + Request["pgNumber"] + "頁(yè)");
   }
  }
 }
}

Ok了,在我的機(jī)器上(vs2008)測(cè)試通過(guò),簡(jiǎn)單的ajax分頁(yè)效果就實(shí)現(xiàn)了。

希望本文所述對(duì)大家ajax程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:
  • ASP.NET和MSSQL高性能分頁(yè)實(shí)例代碼
  • asp.net分頁(yè)功能實(shí)現(xiàn)
  • ASP.NET無(wú)刷新分頁(yè)簡(jiǎn)單實(shí)現(xiàn)
  • asp.net實(shí)現(xiàn)簡(jiǎn)單分頁(yè)實(shí)例
  • asp.net gridview分頁(yè):第一頁(yè) 下一頁(yè) 1 2 3 4 上一頁(yè) 最末頁(yè)
  • asp.net使用AJAX實(shí)現(xiàn)無(wú)刷新分頁(yè)
  • asp.net中的GridView分頁(yè)問(wèn)題
  • ASP.NET MVC 5使用X.PagedList.Mvc進(jìn)行分頁(yè)教程(PagedList.Mvc)
  • asp.net利用后臺(tái)實(shí)現(xiàn)直接生成html分頁(yè)的方法
  • asp.net 使用js分頁(yè)實(shí)現(xiàn)異步加載數(shù)據(jù)
  • asp.net中利用Jquery+Ajax+Json實(shí)現(xiàn)無(wú)刷新分頁(yè)的實(shí)例代碼
  • Asp.Net實(shí)現(xiàn)的通用分頁(yè)函數(shù)

標(biāo)簽:林芝 海南 鄭州 洛陽(yáng) 遼源 邢臺(tái) 舟山 內(nèi)蒙古

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《asp.net+ajax簡(jiǎn)單分頁(yè)實(shí)例分析》,本文關(guān)鍵詞  asp.net+ajax,簡(jiǎn)單,分頁(yè),實(shí)例分析,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問(wèn)題,煩請(qǐng)?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無(wú)關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《asp.net+ajax簡(jiǎn)單分頁(yè)實(shí)例分析》相關(guān)的同類(lèi)信息!
  • 本頁(yè)收集關(guān)于asp.net+ajax簡(jiǎn)單分頁(yè)實(shí)例分析的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章