静态页中利用AJAX.NET实现无刷新页面_Web开发_学习笔记★闵涛★计算机学习电脑编程软硬件技巧


	转至繁体中文版	\| 网站首页 \| 图文教程 \| 资源下载 \| 站长博客 \| 图片素材 \| 武汉seo \| 武汉网站优化 \|

静态页中利用AJAX.NET实现无刷新页面

作者：闵涛文章来源：闵涛的学习笔记点击数：801 更新时间：2009/4/23 10:35:39

　　下载本文源代码

　　一、导言

　　我们知道，ASP.net应用程序事实是在服务器上运行的，用户的请求要不断地送往远程的服务器，服务器执行完本地的程序后把重新装载页面再发送客户端。所以就出现了不断刷新的问题，页面不断闪烁。用户不厌其烦，运行效率也大大4降低，服务器的负荷加重。事实，客户端的请求在某一时刻只是通过向 Web 服务器提交新的请求来检索对用户输入所做的响应。这种情况下，开发人员可以使用 JavaScript 在客户端上加载所有响应，从而提供更好的用户体验。遗憾的是，在很多情况下，不必将所有响应都返回或加载到 JavaScript 要更好，只返回所要的结果，执行过程仍然在服务器上运行。AJAX 提供了一种新的中间选择，能够在维持及时响应和灵活性的同时利用基于服务器的应用程序。

　　AJAX依靠服务器作为中介来分发和处理请求。为了完成这项工作，.net封装类依赖于客户端的请求对象，而xmlHttpRequest对象被大部分的浏览器支持，因此使用这个对象是一个不错的解决方案。

　　因此，为了实现不刷新的页面，我们的客户端页面做成静态页面。静态页面通过Ajax.net调用.net类的方法。这是一种最简洁又高效的解决方案。

　　二、如何应用Ajax.net

　　1.在工程中引入Ajax.dll文件。

　　Ajax.dll是微软开发的应用在asp.net上的一个类库文件。该类库封装了XmlHttpRequest请求服务器的实现细节，是Ajax知识应用在asp.net平台上的解决技术。在.net项目中，添加上对其的引用，然后就可以开始使用ajax.dll封装进行开发了。

　　2.在web.config中设置HttpHandle

　　为了使其可以工作，第一步必须做的是在web.config中安装设置封装包的HttpHandle，不去详细解释HttpHandle是如何工作的，我们只需要了解他们可以用来处理asp.net请求。例如，所有的目的为*.aspx的请求可以通过System.Web.UI.PageHandlerFactory类发送到控制句柄，简单的说，我们把任何向ajax/*.ashx的请求发送到Ajax.PageHandlerFactory的请求处理句柄。

　　3.编写服务端函数

　　现在我们编写服务器端函数，他们可以被客户端异步的调用。尽管现在还不能支持全部的返回类型，我们仍坚持服务器端添加功能。在codebehind文件的页面类里，添加下面的方法：

[Ajax.AjaxMethod()]
public int ServerSideAdd(int firstNumber, int secondNumber)
{
　return firstNumber + secondNumber;
}
　　注意，这个函数有Ajax.AjaxMethod()定制属性，属性服务会告知ajax封装类为此方法创建一个javascript代理，这样才能被客户端调用。

　　三、应用实例(点击下载源码)

　　我们的应用程序主要是对数据库的操作，数据库的数据通过页面的表格呈现，页面完成增加、删除、更新、查询等功能。更主要的是它是一个通用的并且实现方法极为巧妙的例子。任何页面没有刷新现象并且代码十分精巧。下面的就通过Ajax技术实现这些功能。

　　·建立工程HttpForAjax，并在您的工程中引入Ajax.dll文件。

　　·在您的Web.config中加上。

＜httpHandlers＞
＜add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax"/＞
＜/httpHandlers＞
　　·建立您的HTML页。

　　1. 向工程里添加HTML页InfoClass.htm。该页面完成查询、常用工具及数据展现等功能。

　　页面主要放了四个DIV，一个是树" divTree "。一个是查询区叫"divFindTable"的，一个是工具栏叫
"divToolbar"的，一个是数据区叫"divDataGrid"的。如下图:

　　2. 在＜HEAD＞与＜/HEAD＞间加入一些引用如下：

＜script src=js/Xml.js＞＜/script＞
＜link href="css/myStyle.css" type="text/css" rel="stylesheet"＞
＜script src="/HttpForAjax/ajax/common.ashx" type="text/javascript"＞＜/script＞
＜script src="/HttpForAjax/ajax/Ttyu.AjaxData,HttpForAjax.ashx" type="text/javascript"＞＜/script＞
　　说明：Xml.js是用javascript写的一些客户端程序。

　　myStyle.css为样式风格文件。

　　common.ashx为调用Ajax的公用方法。

　　HttpForAjax.ashx为下面我们要用Ajax编写的类的引用。其中HttpForAjax为工程的命名空间。

　　Ttyu.AjaxData为自己开发的类，其中Ttyu为命名空间，AjaxData为类名。 137

[C语言系列]NET 中C#的switch语句的语法  [系统软件]托拽Explore中的文件到VB.net的窗口
[系统软件]Boost库在XP+Visual C++.net中的安装  [常用软件]新配色面板：Paint.Net3.0RC1官方下载
[常用软件]用内建的“Net Meeting”聊天  [VB.NET程序]Henry的VB.NET之旅（三）—共享成员
[VB.NET程序]Henry的VB.NET之旅（二）—构造与析构  [VB.NET程序]Henry的VB.NET之旅（一）—失踪的窗体
[VB.NET程序]在托盘上显示Balloon Tooltip（VB.NET）  [VB.NET程序]Henry手记－VB.NET中动态加载Treeview节点（二）

教程录入：mintao 责任编辑：mintao

上一篇教程： ASP.NET Atlas ListView显示列表数据

下一篇教程：在ASP.NET中自动给URL加上超链接

【字体：小大】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】

注：本站部分文章源于互联网，版权归原作者所有！如有侵权，请原作者与本站联系，本站将立即删除！本站文章除特别注明外均可转载，但需注明出处！ [MinTao学以致用网]

　网友评论：（只显示最新10条。评论内容只代表网友观点，与本站立场无关！）

同类栏目

· Web开发  · 网页制作
· 平面设计  · 网站运营
· 网站推广  · 搜索优化
· 建站心得  · 站长故事
· 互联动态

热门推荐

没有教程

赞助链接

闵涛博文

500 - 内部服务器错误。

您查找的资源存在问题，因而无法显示。

鄂公网安备 42011102001154号

站长：MinTao ICP备案号：鄂ICP备11006601号-18

闵涛站盟:医药大全-武穴网。A打造B、C、D……