?????? Ajax技術在時下很熱門，當然在CS2.0中也不例外的運用到了此技術，CS2中沒有使用任何第三方Ajax控件，這就給我們提供一個研究Ajax機理的好地方，現介紹一下在CS2中Ajax的一些簡單應用，并分析應用的原理。

?????? 我想要研究此技術最好的辦法就是把代碼分離出來放在自己的工程中，重現這些功能，在重現這些功能的時候一定會遇到這樣或那樣的問題，這恰好是我們應該著重研究的地方，所以讓我們先來分離代碼吧。

?????? 就拿CS中的一個Ajax小應用來說，當具有系統管理員權限的用戶進入后，可以看到頁面的標題和一些新聞內容是可以無刷新改變的，讓我們先從此處下手吧。找到相應的控件頁面，我們會發現，這些控件引用的一些文件，我現在先把它們列出來，下面的截圖是我在分析TitleBar代碼后分離出來的：

?

??????? 參看上圖，有這么幾個文件是很關鍵的：

??????? AjaxManager.cs主要提供Ajax應用所需要的功能枚舉等等，此文件包含三個類見圖2，其中AjaxManager里面包含了幾個靜態方法，這個是關鍵。

??????? Global.js這個文件主要包含兩個重要的腳本函數來處理客戶端的Ajax提交，另外還有一些很有用的js函數。

當然，這兩個文件只是基礎，要使用ajax必需要相應的頁面的配合和對js編程的熟悉，現在讓我們來了解一下Ajax的機理，Ajax說白了就是使用JS腳本和XMLHttp技術在后臺提交數據到服務器，經過服務器相應方法的處理后把數據返回給客戶端，由于數據在后臺提交的，用戶只看到數據的變化卻看不到頁面的刷新，功能酷酷的，實現起來也不難，這就開始了：

首先讓我們看看在CS2中的Ajax的實現原理

?

按照上圖的步驟來分析，并且以一個實例來了解它，這個示例很簡單：在客戶端提供兩個用戶輸入的數字，提交到服務器進行計算，并把計算結果返回給客戶端。

（在看下面的解說之前最好先下載本篇文章的示例程序結合著看。）

?????? 首先，我們建立一個aspx的頁面，這里命名為Default.aspx，第一步要在提交請求的時候讓頁面注冊Ajax_CallBack腳本（此腳本即是客戶端和服務器通訊的關鍵），這里我們的后臺代碼很簡單你可以在Page_Load方法里寫成這樣if(!this.IsPostBack) AjaxManager.Register(this,"Counter");可以看出調用了AjaxManager的靜態方法，此方法的作用就是分析傳進去的參數(這里的參數為this也就是頁面的引用)，生成客戶端Ajax_CallBack腳本。在生成腳本之前自動去找在此頁面有多少個帶了AjaxMethod屬性的方法，一個服務器方法對應一個客戶端Ajax_CallBack方法，生成了客戶端腳本后我們只需要在客戶端寫上少量的調用方法即可與服務器通訊了。在這里注冊到客戶端的腳本為：

"CounterEnter":?function(first,?second,?clientCallBack)?{
????return?Ajax_CallBack('ASP.Default_aspx',?null,?'CounterEnter',?[first,second],?clientCallBack,?false,?false,?false,?false,'/cs_ajax/Default.aspx?Ajax_CallBack=true');
}
有了這個腳本，客戶端的工作并沒有做完，因為還沒有讓客戶端控件響應操作，這里就需要我們手動寫一些操作代碼了，不過一般不會太復雜，比如這里我們只需要在頁面加多這樣的js語句快：
function?CounterEnter(){
$('txtResult').value=?iteSettings.CounterEnter($('txtFirst').value,$('txtSecond').value,null).value;?}

???? 在客戶端的按鈕onclick事件上調用此函數即可，這段客戶端的代碼也許有人會迷糊，其中“$”函數是Glogal.js文件中的，等同于document.getElementById，iteSettings.CounterEnter則是調用前面注冊到客戶端的腳本，那么這段代碼的意思是傳遞第一個和第二個輸入筐的值到服務器器上的CounterEnter方法，并把返回的結果付給txtResult的文本框，前面已經提到過服務器上的CounterEnter方法此方法帶有AjaxMethod屬性，程序會自動找到此方法并執行的。至于怎么找到的，在后面詳解，服務器方法在執行完此方法后返回結果，返回的值通過AjaxManager的相關方法以js腳本的形式Response給客戶端（形式如：{value:’aaa’,error:null}），在得到這個返回對象后我們只需要調用其中的Value屬性即可獲取返回的值。
??? 那么服務器怎樣去分辨是Get請求還是PostBack或者AjaxPostBack呢，只有分清楚了這個才能在該執行的時候執行相應的方法，好的，其實在這里通過Get方法和AjaxPost的數據asp.net都不認為是回發給服務器，這樣一來我們在PageLoad代碼里的寫的if(!this.IsPostBack)對兩者請求都視為等效，那么通過后臺的AjaxPost請求的頁面同樣會去執行AjaxManager.Register方法，那么我們看看此方法除了注冊客戶端JS代碼還做了寫什么呢。我們注意到在最后一段代碼里有一句：control.PreRender += new EventHandler(OnPreRender);這句話就是在當即將Response給客戶端頁面的時候執行OnPreRender方法先，此方法的作用即是判斷客戶端提交的參數里是否有Ajax參數，如果有就判斷此次Request為Ajax提交，需要執行服務器的相關方法，此處通過一系列的跳轉和反射找到了應該調用的方法并執行，返回執行完后的結果給客戶端并中止頁面繼續Responst，這樣就完成了一個完整的Ajax調用，當然在AjaxManager里面有很多細節在這里沒有詳細寫出來，如有異議或疑問希望多多指正和探討，也希望此篇帖子能起到拋磚引玉的作用，給大家一個小小的參考。
?? 下一篇將介紹Ajax在CS2中的高級應用，本文示例下載。

總結

以上是生活随笔為你收集整理的Community Server系列之四：Ajax在CS2.0中的应用1的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。