ajax入门体会（转）
生活随笔
收集整理的這篇文章主要介紹了
ajax入门体会（转）
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
注：我是使用ASP.NET的
使用AJAX的目的沒(méi)別的，就是實(shí)現(xiàn)無(wú)刷新更新頁(yè)面，所謂異步就是不用執(zhí)行后臺(tái)程序，前臺(tái)就會(huì)得到相應(yīng)的改變值，從而實(shí)現(xiàn)前臺(tái)頁(yè)面改變數(shù)據(jù)的目的，而這個(gè)改變的值還是通過(guò)后CS代碼操作改變的，聽(tīng)起來(lái)會(huì)很不可意，這是怎么作到的那，聽(tīng)我慢慢說(shuō)。 經(jīng)過(guò)我這幾天的研究，在ASP.NET里實(shí)現(xiàn)AJAX的方法可不只一種 1. 有直接用框架的：這種我比較喜歡，因?yàn)楸容^干凈，用自己的框架，我試過(guò)Ajaxpro和Prototype，這兩種我用過(guò)了，覺(jué)得不錯(cuò)，以后我還會(huì)繼續(xù)用，Jquery其實(shí)也屬于這一范疇，今天研究半天，沒(méi)太明白，可能是我沒(méi)找到現(xiàn)成的框架吧，所以就不研究了 2. 還有一種就是用微軟專(zhuān)門(mén)為Ajax開(kāi)發(fā)的控件包，叫作ASP.NET AJAX Control Toolkit，這個(gè)我沒(méi)太研究，網(wǎng)上有相關(guān)資料，想知道的可以自己去查，里面有很多現(xiàn)成的控件可以實(shí)現(xiàn)AJAX。 3. 用VS2005的可以下個(gè)ASPAJAXExtSetup.msi，里面有updatepanel控件也可以實(shí)現(xiàn)AJAX，這個(gè)我只初步試了一下，也好用，不過(guò)原理還不太明白。 以上三種是我收集到的一些AJAX的實(shí)現(xiàn)方法，我要講的是第一種方法的應(yīng)用，因?yàn)榈谝环N能叫你明白AJAX的運(yùn)行原理，比較適合初學(xué)者。
我主要講Ajaxpro，這是個(gè)組件，必須去網(wǎng)上下載，其實(shí)就是一個(gè)Ajaxpro.dll文件，注意，網(wǎng)上有兩種一種叫Ajax.dll一種叫 Ajaxpro.dll，這兩種功能上是一樣的，就是添加引用的語(yǔ)句有些不同，下面我會(huì)分別說(shuō)的。其實(shí)用AJAX都要下相關(guān)組件的，開(kāi)始我也不習(xí)慣下什么插件，可后來(lái)還是下了，不下不行呀。我下到的是Ajax.dll，所以講時(shí)以Ajax.dll為準(zhǔn)。 應(yīng)用篇，這以下的東西會(huì)借鑒網(wǎng)上其他人的文章，在這里聲明一下 1.先把Ajax.dll添加引用到項(xiàng)目中，別告訴我不會(huì)，如果連這個(gè)也不會(huì)就太那個(gè)了，和添加其他DLL一樣，在項(xiàng)目上右擊，菜單上有個(gè)[添加引用]，然后一步一步把那個(gè).DLL文件添加進(jìn)來(lái)，之后你會(huì)在項(xiàng)目的引用中看到那個(gè)Ajax.dll就是添加成功了
2.修改Web.config。在 <system.web> 元素中添加以下代碼。這里的Ajax.dll和Ajaxpro.dll引用方法是不一樣的，一定要注意
<configuration>
<system.web>
<httpHandlers>
<!-- Ajax.dll的配置文件寫(xiě)法為,我下載到的是這個(gè) -->
<add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" />
<!-- AjaxPro.dll的配置文件寫(xiě)法為，根據(jù)你下載到的DLL文件選擇不同的配置語(yǔ)句-->
<add verb="*" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro"/>
</httpHandlers>
</system.web>
</configuration> 3對(duì)AjaxPro用到的頁(yè)P(yáng)age_Load事件中進(jìn)行運(yùn)行時(shí)注冊(cè)。如：
??? protected void Page_Load(object sender, EventArgs e)
????? {
Ajax.Utility.RegisterTypeForAjax(typeof(_Default));//是Ajax.dll的
AjaxPro.Utility.RegisterTypeForAjax(typeof(_Default));//Ajaxpro.dll的
????? }
//這的_Default是指頁(yè)面類(lèi)的類(lèi)名,就是這個(gè)頁(yè)面的名字。如是放在命名空間，則需要寫(xiě)上完整的命名空間（如：namespaces._Default） 4. 創(chuàng)建服務(wù)器端方法???
????? [Ajax.AjaxMethod]//這句一定要有，如果你是Ajaxpro.dll就寫(xiě)成[AjaxPro.AjaxMethod]
????? public string getValue(int a,int b)
????? {?
??????? //該方法我們將實(shí)現(xiàn)從客戶(hù)端傳入兩個(gè)數(shù)，在服務(wù)器端相加計(jì)算后返回到客戶(hù)端。這里可以寫(xiě)在原來(lái)的頁(yè)后臺(tái)中也可以單獨(dú)寫(xiě)一個(gè)類(lèi)。
????????? return Convert.ToString(a+b);//這里返回的就是前臺(tái)得到的值，反正參數(shù)已經(jīng)進(jìn)CS文件了，想怎么操作就怎么操作，包括讀庫(kù)都可以。 5. 客戶(hù)端調(diào)用。
<%@ Page language="c#" Codebehind="WebPage1.aspx.cs" AutoEventWireup="false" Inherits="Web.WebPage1" %>
<script language="javascript">
??? function getValue()
??????? { //這里如果是AjaxPor.dll就加Web._Default.getValue,如果是Ajax.dll就不用加命名空間如下
????????????? _Default.getValue(1,2,getGroups_callback);//該處即調(diào)用服務(wù)器端的_Default.getValue方法。
??? //_Default就是寫(xiě)getValue的那個(gè)類(lèi)，如果寫(xiě)在本頁(yè)CS里就是WebPage1.getValue，1和2是參數(shù)。
????? //這在里邊getGroups_callback指定的是個(gè)回調(diào)函數(shù)，以接受服務(wù)器端處理完后返回客戶(hù)端結(jié)果。
????????? }
?
??? //這個(gè)方法用戶(hù)接受并處理服務(wù)器端返回的結(jié)果。
????? function getGroups_callback(response)
??? {
??????? var dt=response.value;//這個(gè)值就是最終傳回來(lái)的值，想怎么用就怎么用，反正回前臺(tái)了。
document.getElementById("Div_1").innerHTML=dt;
??? }
</script>?
<body>
<div id="Div_1"> </div>
<button </botton>
</body> 本文來(lái)自CSDN博客，轉(zhuǎn)載請(qǐng)標(biāo)明出處：http://blog.csdn.net/yefengzhixia/archive/2009/02/14/3890157.aspx
使用AJAX的目的沒(méi)別的，就是實(shí)現(xiàn)無(wú)刷新更新頁(yè)面，所謂異步就是不用執(zhí)行后臺(tái)程序，前臺(tái)就會(huì)得到相應(yīng)的改變值，從而實(shí)現(xiàn)前臺(tái)頁(yè)面改變數(shù)據(jù)的目的，而這個(gè)改變的值還是通過(guò)后CS代碼操作改變的，聽(tīng)起來(lái)會(huì)很不可意，這是怎么作到的那，聽(tīng)我慢慢說(shuō)。 經(jīng)過(guò)我這幾天的研究，在ASP.NET里實(shí)現(xiàn)AJAX的方法可不只一種 1. 有直接用框架的：這種我比較喜歡，因?yàn)楸容^干凈，用自己的框架，我試過(guò)Ajaxpro和Prototype，這兩種我用過(guò)了，覺(jué)得不錯(cuò)，以后我還會(huì)繼續(xù)用，Jquery其實(shí)也屬于這一范疇，今天研究半天，沒(méi)太明白，可能是我沒(méi)找到現(xiàn)成的框架吧，所以就不研究了 2. 還有一種就是用微軟專(zhuān)門(mén)為Ajax開(kāi)發(fā)的控件包，叫作ASP.NET AJAX Control Toolkit，這個(gè)我沒(méi)太研究，網(wǎng)上有相關(guān)資料，想知道的可以自己去查，里面有很多現(xiàn)成的控件可以實(shí)現(xiàn)AJAX。 3. 用VS2005的可以下個(gè)ASPAJAXExtSetup.msi，里面有updatepanel控件也可以實(shí)現(xiàn)AJAX，這個(gè)我只初步試了一下，也好用，不過(guò)原理還不太明白。 以上三種是我收集到的一些AJAX的實(shí)現(xiàn)方法，我要講的是第一種方法的應(yīng)用，因?yàn)榈谝环N能叫你明白AJAX的運(yùn)行原理，比較適合初學(xué)者。
我主要講Ajaxpro，這是個(gè)組件，必須去網(wǎng)上下載，其實(shí)就是一個(gè)Ajaxpro.dll文件，注意，網(wǎng)上有兩種一種叫Ajax.dll一種叫 Ajaxpro.dll，這兩種功能上是一樣的，就是添加引用的語(yǔ)句有些不同，下面我會(huì)分別說(shuō)的。其實(shí)用AJAX都要下相關(guān)組件的，開(kāi)始我也不習(xí)慣下什么插件，可后來(lái)還是下了，不下不行呀。我下到的是Ajax.dll，所以講時(shí)以Ajax.dll為準(zhǔn)。 應(yīng)用篇，這以下的東西會(huì)借鑒網(wǎng)上其他人的文章，在這里聲明一下 1.先把Ajax.dll添加引用到項(xiàng)目中，別告訴我不會(huì)，如果連這個(gè)也不會(huì)就太那個(gè)了，和添加其他DLL一樣，在項(xiàng)目上右擊，菜單上有個(gè)[添加引用]，然后一步一步把那個(gè).DLL文件添加進(jìn)來(lái)，之后你會(huì)在項(xiàng)目的引用中看到那個(gè)Ajax.dll就是添加成功了
2.修改Web.config。在 <system.web> 元素中添加以下代碼。這里的Ajax.dll和Ajaxpro.dll引用方法是不一樣的，一定要注意
<configuration>
<system.web>
<httpHandlers>
<!-- Ajax.dll的配置文件寫(xiě)法為,我下載到的是這個(gè) -->
<add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" />
<!-- AjaxPro.dll的配置文件寫(xiě)法為，根據(jù)你下載到的DLL文件選擇不同的配置語(yǔ)句-->
<add verb="*" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro"/>
</httpHandlers>
</system.web>
</configuration> 3對(duì)AjaxPro用到的頁(yè)P(yáng)age_Load事件中進(jìn)行運(yùn)行時(shí)注冊(cè)。如：
??? protected void Page_Load(object sender, EventArgs e)
????? {
Ajax.Utility.RegisterTypeForAjax(typeof(_Default));//是Ajax.dll的
AjaxPro.Utility.RegisterTypeForAjax(typeof(_Default));//Ajaxpro.dll的
????? }
//這的_Default是指頁(yè)面類(lèi)的類(lèi)名,就是這個(gè)頁(yè)面的名字。如是放在命名空間，則需要寫(xiě)上完整的命名空間（如：namespaces._Default） 4. 創(chuàng)建服務(wù)器端方法???
????? [Ajax.AjaxMethod]//這句一定要有，如果你是Ajaxpro.dll就寫(xiě)成[AjaxPro.AjaxMethod]
????? public string getValue(int a,int b)
????? {?
??????? //該方法我們將實(shí)現(xiàn)從客戶(hù)端傳入兩個(gè)數(shù)，在服務(wù)器端相加計(jì)算后返回到客戶(hù)端。這里可以寫(xiě)在原來(lái)的頁(yè)后臺(tái)中也可以單獨(dú)寫(xiě)一個(gè)類(lèi)。
????????? return Convert.ToString(a+b);//這里返回的就是前臺(tái)得到的值，反正參數(shù)已經(jīng)進(jìn)CS文件了，想怎么操作就怎么操作，包括讀庫(kù)都可以。 5. 客戶(hù)端調(diào)用。
<%@ Page language="c#" Codebehind="WebPage1.aspx.cs" AutoEventWireup="false" Inherits="Web.WebPage1" %>
<script language="javascript">
??? function getValue()
??????? { //這里如果是AjaxPor.dll就加Web._Default.getValue,如果是Ajax.dll就不用加命名空間如下
????????????? _Default.getValue(1,2,getGroups_callback);//該處即調(diào)用服務(wù)器端的_Default.getValue方法。
??? //_Default就是寫(xiě)getValue的那個(gè)類(lèi)，如果寫(xiě)在本頁(yè)CS里就是WebPage1.getValue，1和2是參數(shù)。
????? //這在里邊getGroups_callback指定的是個(gè)回調(diào)函數(shù)，以接受服務(wù)器端處理完后返回客戶(hù)端結(jié)果。
????????? }
?
??? //這個(gè)方法用戶(hù)接受并處理服務(wù)器端返回的結(jié)果。
????? function getGroups_callback(response)
??? {
??????? var dt=response.value;//這個(gè)值就是最終傳回來(lái)的值，想怎么用就怎么用，反正回前臺(tái)了。
document.getElementById("Div_1").innerHTML=dt;
??? }
</script>?
<body>
<div id="Div_1"> </div>
<button </botton>
</body> 本文來(lái)自CSDN博客，轉(zhuǎn)載請(qǐng)標(biāo)明出處：http://blog.csdn.net/yefengzhixia/archive/2009/02/14/3890157.aspx
轉(zhuǎn)載于:https://blog.51cto.com/657956565/200872
創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來(lái)咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)總結(jié)
以上是生活随笔為你收集整理的ajax入门体会（转）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 99% 的同学写不出好代码，都是因为这个
- 下一篇： 别以为程序员的工作就是写代码