1.傳統(tǒng)頁面的過程

很多文件都是通過http協(xié)議請求來傳送的

2.Ajax應(yīng)用????

?異步的發(fā)生請求

頁面部分刷新

減少數(shù)據(jù)傳輸量

（請求的數(shù)據(jù)傳輸量不變，主要是回發(fā)的數(shù)據(jù)傳輸量）

提高用戶的體驗

?? （胡亂應(yīng)用的話，會造成反方向的結(jié)果）

3.???asp.net的ajax應(yīng)用?

服務(wù)器為中心的開發(fā)（是不用寫js代碼的）

客戶端為中心開發(fā)（提供了豐富的支持）

4．microsoft Ajax library

?javascript基礎(chǔ)擴展

?瀏覽器兼容層（ie，forbox）

?面向?qū)ο箢愋拖到y(tǒng)(維護和擴展的方法)

?提供一個異步通信層（對象進行封裝進行擴張，服務(wù)器端和客戶端之間的通信

?提供客戶端基礎(chǔ)類庫（一些模型的基礎(chǔ)）

下面是一段用JavaScript實現(xiàn)的面向?qū)ο蟮南到y(tǒng)

客戶端相應(yīng)用戶請求

Code
<script?language="javascript"?type="text/javascript">
????//注冊一個命名空間（一個類面向?qū)ο?#xff09;
?????Type.registerNamespace("AspNetAjaxOverView");
?????//定義一個Person類
?????//頂一個構(gòu)造函數(shù)，有兩個參數(shù)，將用戶傳入的兩個參數(shù)保存下來
?????//加下劃線的是私有成員
?????AspNetAjaxOverView.Person=function?(firstName,lastName)
?????{
?????????this._firstName=firstName;
?????????this._lastName=lastName?;
?????}
?????//定義成員方法
?????AspNetAjaxOverView.Person.prototype?=
?????{
????????//得到其屬性(方法)
????????get_firstName?:function()
????????{
???????????return?this._firstName;
????????},
????????get_lastName?:function()
????????{
??????????return?this._lastName;
????????},
????????toString?:function()
????????{
???????????return?String.format("Hello,?I'm?{0}?{1}.",
????????????????????this.get_firstName(),
????????????????????this.get_lastName());
????????}
?????}
????AspNetAjaxOverView.Person.registerClass("AspNetAjaxOverView.Person");
????
????AspNetAjaxOverView.Employee=function(firstName,lastName,title)
????{
????????//要傳入父類的構(gòu)造函數(shù)參數(shù)給它
????????AspNetAjaxOverView.Employee.initializeBase(this,[firstName,lastName]);
????????this._title=title;
????}
????AspNetAjaxOverView.Employee.prototype=
????{
???????get_title?:?function?()
???????{
??????????return?this._title;
???????},
???????toString:function?()
???????{
????????????//調(diào)用父類的tostring方法
????????????return?AspNetAjaxOverView.Employee.callBaseMethod(this,"toString")+
????????????"My?title?is?'"+this.get_title()+"'.";
???????}
????}
????//后面是要繼承的類
?????AspNetAjaxOverView.Employee.registerClass("AspNetAjaxOverView.Employee",AspNetAjaxOverView.Person);
????</script>

?以及一個用異步通信層實現(xiàn)信息傳輸

Code
?<script?language="javascript"?type="text/javascript">
????function?showEmployee(firstName,?lastName,?title)
????{
????????//異步通信層定義一些類
????????var?request=new?Sys.Net.WebRequest();
????????//(2)設(shè)置請求URL
????????request.set_url("GetEmployee.ashx");
?????????//(3)設(shè)置請求方式
????????request.set_httpVerb("POST");
????????//(4)設(shè)置請求完成時的處理函數(shù)
????????//回調(diào)函數(shù)含義：發(fā)出一個請求，服務(wù)器通過你指定一個回調(diào)函數(shù)來回復(fù)你
????????request.add_completed(onGetEmployeeComplete);
????????
????????//encodeURIComponent進行轉(zhuǎn)義
????????var?requestBody=String.format(
????????"firstName={0}&lastName={1}&title={2}",
????????encodeURIComponent(firstName),
????????encodeURIComponent(lastName),
????????encodeURIComponent(title));
????????//傳進去
????????request.set_body(requestBody);
????????
????????//發(fā)送信息
????????request.invoke();
????????
????????function?onGetEmployeeComplete(response)
????????{
????????????if(response.get_responseAvailable())
????????????{
??????????????var?employee?=?response.get_object();
??????????????alert(String.format(
????????????????????????"Hello?I'm?{0}?{1},?my?title?is?'{2}'",
????????????????????????employee.FirstName,
????????????????????????employee.LastName,
????????????????????????employee.Title));
????????????}
????????}
????}
????</script>

對應(yīng)請求在一般處理程序?qū)??

Code
<%@?WebHandler?Language="C#"?Class="AspNetAjaxOverview.GetEmployee"?%>

using?System;
using?System.Web;
using?System.Web.Script.Serialization;

namespace?AspNetAjaxOverview
{
????public?class?GetEmployee?:?IHttpHandler
????{
????????//讓服務(wù)器端相應(yīng)客戶端的請求，并發(fā)出相應(yīng)的信息
????????public?void?ProcessRequest(HttpContext?context)
????????{
????????????context.Response.ContentType?=?"text/plain";
????????????
????????????string?firstName?=?context.Request.Params["firstName"];
????????????string?lastName?=?context.Request.Params["lastName"];
????????????string?title?=?context.Request.Params["title"];
????????????Employee?employee?=?new?Employee(firstName,?lastName,?title);

????????????//將對象序列化為json數(shù)據(jù)格式
????????????JavaScriptSerializer?serializer?=?new?JavaScriptSerializer();
????????????string?jsonEmp?=?serializer.Serialize(employee);
????????????
????????????//進行輸出
????????????context.Response.Write(jsonEmp);
????????}

????????public?bool?IsReusable
????????{
????????????get
????????????{
????????????????return?false;
????????????}
????????}

????}
}

其中的Employee類是

Code
public?class?Employee
????{
????????private?string?_FirstName;
????????private?string?_LastName;
????????private?string?_Title;

????????public?Employee()?{?}

????????public?Employee(string?firstName,?string?lastName,?string?title)
????????{
????????????this._FirstName?=?firstName;
????????????this._LastName?=?lastName;
????????????this._Title?=?title;
????????}

????????public?string?FirstName
????????{
????????????get
????????????{
????????????????return?this._FirstName;
????????????}
????????}

????????public?string?LastName
????????{
????????????get
????????????{
????????????????return?this._LastName;
????????????}
????????}

????????public?string?Title
????????{
????????????get
????????????{
????????????????return?this._Title;
????????????}
????????}
????}

客戶端訪問WebService方法

對應(yīng)的JavaScript

Code
<script?language="javascript"?type="text/javascript">
????????????function?showEmployee(firstName,?lastName,?title)
????????????{
????????????????//調(diào)用WebService的方法
????????????????AspNetAjaxOverview.EmployeeService.GetEmployee(
????????????????????firstName,
????????????????????lastName,
????????????????????title,
????????????????????onGetEmployeeSuccess);
????????????}
????????????
????????????//顯示出來
????????????function?onGetEmployeeSuccess(employee)
????????????{
????????????????alert(String.format(
????????????????????"Hello?I'm?{0}?{1},?my?title?is?'{2}'",
????????????????????employee.FirstName,
????????????????????employee.LastName,
????????????????????employee.Title));
????????????}
????????</script>

webservice代碼

Code
<%@?WebService?Language="C#"?Class="AspNetAjaxOverview.EmployeeService"?%>

using?System;
using?System.Web;
using?System.Web.Services;
using?System.Web.Services.Protocols;
using?System.Web.Script.Services;

namespace?AspNetAjaxOverview
{
????[WebService(Namespace?=?"http://tempuri.org/")]
????[WebServiceBinding(ConformsTo?=?WsiProfiles.BasicProfile1_1)]
????[ScriptService]
????public?class?EmployeeService?:?System.Web.Services.WebService
????{
????????[WebMethod]
????????[ScriptMethod]
????????public?Employee?GetEmployee(string?firstName,?string?lastName,?string?title)
????????{
????????????return?new?Employee(firstName,?lastName,?title);
????????}
????}
}

?

?

?

總結(jié)

以上是生活随笔為你收集整理的学习asp.net ajax 笔记（一）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。