您现在的位置是:网站首页> 编程资料编程资料
asp.net+ajax简单分页实例分析_AJAX相关_
2023-05-25
281人已围观
简介 asp.net+ajax简单分页实例分析_AJAX相关_
本文实例讲述了asp.net+ajax简单分页实现方法。分享给大家供大家参考,具体如下:
这里涉及两个.aspx文件,一个叫Default.aspx,一个叫AjaxOperations.aspx,第一个用来显示一些测试数据,后一个用来对分页进行处理。js文件夹下面还有一个testJs.js的文件,它就是ajax操作的核心部分。不错,code is cheap。看代码:
/*testJs.js*/ // 此函数等价于document.getElementById /document.all function $(s) { if (document.getElementById) { return eval('document.getElementById("' + s + '")'); } else { return eval('document.all.' + s); } } // 创建 XMLHttpRequest对象,以发送ajax请求 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目前页码, tP总页数 ,tN总记录数 function showPages(cP, tP, tN) { //处理页码大于总页数 if (cP >= tP) { cP = tP; } //处理页码小于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 = "共" + tN + "项 第" + cP + "/" + tP + "页"; var pageHtml = " 首页"; pageHtml += " 上页 "; for (var i = 1; i < tP + 1; i++) { var numColor = ""; if (i == 1) numColor = "red"; pageHtml += "" + i + " "; } pageHtml += " 下页"; pageHtml += " 尾页"; pageHtml += " " + ""; newCellThree.innerHTML = pageHtml; } //构造页面跳转的js函数,函数中需要判断输入的页号是否是合法的数值 function forward() { if (!(/^([-]){0,1}([0-9]){1,}$/.test($("pgNumber").value))) { //输入的值不合法 alert("请输入合法的页号!"); $("pgNumber").focus(); $("pgNumber").select(); } else gotoPage($("pgNumber").value); } //处理在跳转页面上按下回车的情况 function handleEnterOnPgNumber() { if (event.keyCode == 13) { forward(); return false; } return true; } function gotoPage(oNum) { // 页数不能为0或者为负数 (首页,尾页) if (oNum > 0) { var totalNumber = parseInt($("totalNum").innerText); //总记录数 var curPgNumber = parseInt($("cuPgNumber").innerText); var totalPgNumber = parseInt($("sumPgNumber").innerText); // 总页数 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("请输入合法的页号!"); $("pgNumber").focus(); $("pgNumber").select(); return; } } } function goToNextPrev(oNum) { var addNum = parseInt(oNum); var totalNumber = parseInt($("totalNum").innerText); //总记录数 var curPgNumber = parseInt($("cuPgNumber").innerText); var totalPgNumber = parseInt($("sumPgNumber").innerText); // 总页数 //如果当前页是第一页,点击前一页不用刷新 //如果当前页是最后一页,点击下一页不用刷新 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) { // 处理请求,更新内容 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 = " 获取数据中,请稍等..."; //alert("Connect the server failed!"); } } } xmlReq.send(null); } Default.aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebTest2008.Default" %>
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:
复制代码 代码如下:
<%@ 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"] + "页"); } } } } Ok了,在我的机器上(vs2008)测试通过,简单的ajax分页效果就实现了。
希望本文所述对大家ajax程序设计有所帮助。
您可能感兴趣的文章:
- ASP.NET和MSSQL高性能分页实例代码
- asp.net分页功能实现
- ASP.NET无刷新分页简单实现
- asp.net实现简单分页实例
- asp.net gridview分页:第一页 下一页 1 2 3 4 上一页 最末页
- asp.net使用AJAX实现无刷新分页
- asp.net中的GridView分页问题
- ASP.NET MVC 5使用X.PagedList.Mvc进行分页教程(PagedList.Mvc)
- asp.net利用后台实现直接生成html分页的方法
- asp.net 使用js分页实现异步加载数据
- asp.net中利用Jquery+Ajax+Json实现无刷新分页的实例代码
- Asp.Net实现的通用分页函数
相关内容
- jQuery Ajax 实例详解 ($.ajax、$.post、$.get)_AJAX相关_
- Ajax jsonp跨域请求实现方法_AJAX相关_
- Ajax注册用户时实现表单验证_AJAX相关_
- 分享Ajax创建简单实例代码_AJAX相关_
- Ajax获取XMLHttp对象的方法_AJAX相关_
- ajax中data传参的两种方式分析_AJAX相关_
- Ajax异步提交数据返回值的换行问题实例分析_AJAX相关_
- IE浏览器与FF浏览器关于Ajax传递参数值为中文时的区别实例分析_AJAX相关_
- ajax调用简单实例_AJAX相关_
- 探讨.get .post .ajax ztree 还有后台servlet传递数据的相关知识_AJAX相关_
