ASP.NET2.0服務器控件之客戶端功能
多數在表示層應用的服務器控件主要由兩個部分組成：服務器端功能和客戶端功能。服務器端功能永遠是服務器控件的核心，而隨著技術的發展，客戶端功能也逐漸變得越來越重要。只有兩個部分互相配合，才能創建出功能強大、界面豐富的服務器控件。本文將討論在服務器控件中實現客戶端功能的相關問題，具體內容包括客戶端功能概述、實現簡單客戶端功能、實現復雜客戶端功能，以及部署客戶端文件的實現方法等內容。
1. 客戶端功能簡介
在Web編程中，客戶端功能傳統上是由Web頁開發人員負責，并且不被封裝在服務器組件中。ASP.NET脫離了這一范疇并使服務器控件能夠發出客戶端腳本，從而使服務器控件能夠將客戶端處理與服務器端處理結合起來。實現客戶端功能對于提高服務器控件的交互性和可擴展性的意義重大。例如，常見的TreeView、TabStrip、ToolBar控件等，這些優秀的服務器控件具有很強的交互性和豐富的用戶界面，而這些特征的實現與客戶端功能是密不可分的。
實現客戶端功能的技術主要是客戶端腳本（JavaScript、VBScript等）和DHTML。因此，作為一名合格的開發人員必須具有熟練應用這些技術的能力。除此之外，還要掌握將客戶端功能與服務器控件密切結合的方法。這些內容包括：實現簡單客戶端功能、實現復雜客戶端功能、部署客戶端腳本文件的方法。
2. 實現簡單客戶端功能
如果自定義服務器控件的客戶端功能比較簡單，例如，僅僅是彈出窗口或者改變背景顏色等，那么對于這種情況，通過不使用單獨的客戶端腳本文件封裝，而是直接在控件呈現中實現。其實現的關鍵是在控件的Attributes中添加適當的客戶端處理程序。以下實例說明從System.Web.UI.WebControls.Button類派生的控件MyClickButton，它為客戶端單擊事件提供事件處理程序。請看下面的代碼：
如果讀者已經閱讀了前面有關控件呈現的文章，那么很容易理解以上代碼。以上代碼重寫了AddAttributesToRender方法，它為MyClickButton控件定義了一個名為onclick的Attribute，其值指示在客戶端彈出一個包含自定義信息的確認窗口。如果讀者所開發的服務器控件的客戶端功能都比較簡單，那么可以嘗試利用重寫AddAttributesToRender的方法予以實現。
下面是為使用MyClickControl控件而創建的ASPX頁面源代碼。
當用戶點擊MyClickControl控件時，立刻彈出一個包含提示信息的確認窗口。需要注意的是彈出確認窗口并不是由于頁面回傳，而是用戶激發客戶端處理程序的結果。當點擊"確定"按鈕之后，才會發生頁面回傳。
3. 實現復雜客戶端功能
如果客戶端功能比較復雜，這時一般將完成其功能的代碼封裝在客戶端腳本文件中。為了將這些腳本文件與服務器控件緊密結合起來，.NET 2.0框架提供了將客戶端腳本文件加入服務器控件所需的必要方法。這些方法基本都包含在ClientScriptManager類中。開發人員可以通過調用Page類的ClientScript屬性來獲取ClientScriptManager類實例。該類用于管理腳本、注冊腳本和向頁添加腳本。
可能讀者對于ClientScriptManager類有些陌生，它是ASP.NET 2.0的新增類。該類是專門用于替代已經停止使用的用于管理腳本的Page類的部分方法而創建的，例如，在ASP.NET 1.x中曾經出現的RegisterClientScriptBlock、RegisterStartupScript等等，這些方法都已經停止使用，而改用ClientScriptManager類的相關方法來實現。
下面列舉了來自ClientScriptManager類的，與實現復雜客戶端功能有關的幾個常用方法。
（1）RegisterClientScriptBlock方法
向頁的頂部添加一個腳本塊。以字符串形式創建腳本，然后將其傳遞給方法，方法再將腳本添加到頁中。可以使用此方法將任何腳本插入到頁中。請注意，腳本可能在所有元素完成之前呈現到頁中；因此，您可能無法從腳本中引用頁上的所有元素。
（2）RegisterClientScriptInclude方法
與 RegisterClientScriptBlock 方法類似，但此方法將添加引用外部 .js 文件的腳本塊。包含文件在任何其他動態添加的腳本之前添加；因此，您可能無法引用頁上的某些元素。
（3）RegisterStartupScript方法
向頁中添加一個腳本塊，該腳本塊在頁完成加載后引發頁的 onload 事件之前執行。該腳本通常不創建為事件處理程序或函數；它通常只包含要執行一次的語句。
（4）RegisterOnSubmitStatement方法
添加響應頁的 onsubmit 事件而執行的腳本。該腳本在提交頁之前執行，允許您取消提交。
（5）IsStartupScriptRegistered方法
確定Page對象是否注冊了啟動腳本。
（6）IsClientScriptBlockRegistered方法
確定Page對象是否注冊了客戶端腳本。
除了以上幾個方法之外，ClientScriptManager類還包括其他一些相關方法，有興趣的讀者可以閱讀相關資料。通過在服務器控件中靈活使用以上方法，我們可完成為控件加入客戶端行為，同時也帶來了以下好處：
（1）有效的減少所顯示頁面的大小，因為很多有關客戶端功能的代碼都封裝到了客戶端腳本文件中，在控件中只需引用腳本文件的地址即可。
（2）由于同一控件共享腳本文件，因此通過瀏覽器的緩存機制，可以改善應用程序的性能。
（3）提高了控件的靈活性和可擴展性。通過修改腳本文件，控件開發者可以很容易的修改客戶端功能而不用編譯服務器控件。
另外，在對復雜客戶端功能處理的過程中，有時還需要在客戶端腳本中訪問控件。控件開發者可以在腳本中訪問呈現到客戶端的對象，并且對其進行操作。下面來簡單介紹一些有關內容。
Control基類有一個ClientID的屬性，它作為所呈現的元素的ID屬性呈現。ASP.NET動態為一個控件生成ClientID，并且確保頁上每一控件的ClientID是唯一的。因此，可通過在文檔對象模型中使用控件的ID在客戶端上訪問該控件（即，由該控件呈現的元素）。控件還可以使用ClientID為它可以呈現的任何附加元素（例如隱藏域）生成唯一名稱。
將ClientID的值發出到內聯腳本中（或者發出到腳本庫的代碼中）可能是較為棘手的，因為該ClientID必須插在字符串變量中的正確位置。以下實例使用轉義符將ClientID插入構成內聯腳本的字符串中。
另外，還可以使用String類的重載的Format方法撰寫使用ClientID的客戶端腳本。
4. 部署客戶端文件的方法
默認安裝的情況下，在wwwroot文件夾下存在一個子文件夾asp_client，其中保存了用于支持智能導航、驗證控件等功能的客戶端腳本文件。很顯然這些文件非常重要。為了提高應用的規范性，建議開發人員在部署客戶端文件過程中，采用以下方法。
· 將包含有客戶端腳本的文件夾置于asp_client文件夾中，尤其是對于那些安裝在全局配件緩存（GAC）中的控件更應該這樣做。
· 包含腳本的文件夾推薦使用與控件相關的名稱。
· 推薦在包含腳本的文件夾下不要直接放置腳本文件，而是再創建一個名稱為控件版本號的文件夾，將腳本文件放置其中。
例如，開發人員創建了一個版本為1.0的服務器控件MyControl，其關聯一個客戶端腳本ClientScript.js，并且將該控件加入了GAC中。這時推薦部署客戶端腳本文件的路徑為：c:Inetputwwwrootasp_clientMyControl_Client1.0ClientScript.js。另外，在客戶端文件庫中存儲的并不僅是腳本文件，也可以加入控件所需的樣式表文件、圖片等其他文件。
以上為部署客戶端文件的推薦方法，那么這是不是說明所有的客戶端腳本文件都需要遵循以上規則呢？當然不是。只要開發人員從實際出發，從提高程序的可維護性和方便性著眼，那么無論客戶端腳本文件置于何處，都是可以的。
5. 小結
本文主要介紹了與實現服務器控件客戶端功能相關的內容。這些內容對于開發出交互性強的服務器控件非常重要。掌握這些內容并不困難，真正困難的是如何開發完成客戶端功能的CSS文件、JS腳本、DHTML程序等。這些技術的掌握不是一朝一夕就可以完成的，它需要扎實的基礎，刻苦的鉆研。而所有這些技術和精神品質都是一名合格的開發人員所必需掌握的精髓，缺一不可。
1. 客戶端功能簡介
在Web編程中，客戶端功能傳統上是由Web頁開發人員負責，并且不被封裝在服務器組件中。ASP.NET脫離了這一范疇并使服務器控件能夠發出客戶端腳本，從而使服務器控件能夠將客戶端處理與服務器端處理結合起來。實現客戶端功能對于提高服務器控件的交互性和可擴展性的意義重大。例如，常見的TreeView、TabStrip、ToolBar控件等，這些優秀的服務器控件具有很強的交互性和豐富的用戶界面，而這些特征的實現與客戶端功能是密不可分的。
實現客戶端功能的技術主要是客戶端腳本（JavaScript、VBScript等）和DHTML。因此，作為一名合格的開發人員必須具有熟練應用這些技術的能力。除此之外，還要掌握將客戶端功能與服務器控件密切結合的方法。這些內容包括：實現簡單客戶端功能、實現復雜客戶端功能、部署客戶端腳本文件的方法。
2. 實現簡單客戶端功能
如果自定義服務器控件的客戶端功能比較簡單，例如，僅僅是彈出窗口或者改變背景顏色等，那么對于這種情況，通過不使用單獨的客戶端腳本文件封裝，而是直接在控件呈現中實現。其實現的關鍵是在控件的Attributes中添加適當的客戶端處理程序。以下實例說明從System.Web.UI.WebControls.Button類派生的控件MyClickButton，它為客戶端單擊事件提供事件處理程序。請看下面的代碼：
| public class MyClickButton : Button{ //相關代碼 ...... protected override void AddAttributesToRender(HtmlTextWriter writer) { base.AddAttributesToRender(writer); writer.AddAttribute("onclick", "window.confirm('謝謝您! ');"); } } |
如果讀者已經閱讀了前面有關控件呈現的文章，那么很容易理解以上代碼。以上代碼重寫了AddAttributesToRender方法，它為MyClickButton控件定義了一個名為onclick的Attribute，其值指示在客戶端彈出一個包含自定義信息的確認窗口。如果讀者所開發的服務器控件的客戶端功能都比較簡單，那么可以嘗試利用重寫AddAttributesToRender的方法予以實現。
下面是為使用MyClickControl控件而創建的ASPX頁面源代碼。
| ＜%@ Page Language = "C#" %＞ ＜%@ Register TagPrefix="Custom" Namespace="MyControls" Assembly = "MyControls" %＞ ＜html＞ ＜body＞ ＜form runat=server＞ 請點擊下面的按鈕 ＜Custom:MyClickButton Id = "demo" runat=server/＞ ＜br＞ ＜/form＞ ＜/body＞ ＜/html＞ |
當用戶點擊MyClickControl控件時，立刻彈出一個包含提示信息的確認窗口。需要注意的是彈出確認窗口并不是由于頁面回傳，而是用戶激發客戶端處理程序的結果。當點擊"確定"按鈕之后，才會發生頁面回傳。
3. 實現復雜客戶端功能
如果客戶端功能比較復雜，這時一般將完成其功能的代碼封裝在客戶端腳本文件中。為了將這些腳本文件與服務器控件緊密結合起來，.NET 2.0框架提供了將客戶端腳本文件加入服務器控件所需的必要方法。這些方法基本都包含在ClientScriptManager類中。開發人員可以通過調用Page類的ClientScript屬性來獲取ClientScriptManager類實例。該類用于管理腳本、注冊腳本和向頁添加腳本。
可能讀者對于ClientScriptManager類有些陌生，它是ASP.NET 2.0的新增類。該類是專門用于替代已經停止使用的用于管理腳本的Page類的部分方法而創建的，例如，在ASP.NET 1.x中曾經出現的RegisterClientScriptBlock、RegisterStartupScript等等，這些方法都已經停止使用，而改用ClientScriptManager類的相關方法來實現。
下面列舉了來自ClientScriptManager類的，與實現復雜客戶端功能有關的幾個常用方法。
（1）RegisterClientScriptBlock方法
向頁的頂部添加一個腳本塊。以字符串形式創建腳本，然后將其傳遞給方法，方法再將腳本添加到頁中。可以使用此方法將任何腳本插入到頁中。請注意，腳本可能在所有元素完成之前呈現到頁中；因此，您可能無法從腳本中引用頁上的所有元素。
（2）RegisterClientScriptInclude方法
與 RegisterClientScriptBlock 方法類似，但此方法將添加引用外部 .js 文件的腳本塊。包含文件在任何其他動態添加的腳本之前添加；因此，您可能無法引用頁上的某些元素。
（3）RegisterStartupScript方法
向頁中添加一個腳本塊，該腳本塊在頁完成加載后引發頁的 onload 事件之前執行。該腳本通常不創建為事件處理程序或函數；它通常只包含要執行一次的語句。
（4）RegisterOnSubmitStatement方法
添加響應頁的 onsubmit 事件而執行的腳本。該腳本在提交頁之前執行，允許您取消提交。
（5）IsStartupScriptRegistered方法
確定Page對象是否注冊了啟動腳本。
（6）IsClientScriptBlockRegistered方法
確定Page對象是否注冊了客戶端腳本。
除了以上幾個方法之外，ClientScriptManager類還包括其他一些相關方法，有興趣的讀者可以閱讀相關資料。通過在服務器控件中靈活使用以上方法，我們可完成為控件加入客戶端行為，同時也帶來了以下好處：
（1）有效的減少所顯示頁面的大小，因為很多有關客戶端功能的代碼都封裝到了客戶端腳本文件中，在控件中只需引用腳本文件的地址即可。
（2）由于同一控件共享腳本文件，因此通過瀏覽器的緩存機制，可以改善應用程序的性能。
（3）提高了控件的靈活性和可擴展性。通過修改腳本文件，控件開發者可以很容易的修改客戶端功能而不用編譯服務器控件。
另外，在對復雜客戶端功能處理的過程中，有時還需要在客戶端腳本中訪問控件。控件開發者可以在腳本中訪問呈現到客戶端的對象，并且對其進行操作。下面來簡單介紹一些有關內容。
Control基類有一個ClientID的屬性，它作為所呈現的元素的ID屬性呈現。ASP.NET動態為一個控件生成ClientID，并且確保頁上每一控件的ClientID是唯一的。因此，可通過在文檔對象模型中使用控件的ID在客戶端上訪問該控件（即，由該控件呈現的元素）。控件還可以使用ClientID為它可以呈現的任何附加元素（例如隱藏域）生成唯一名稱。
將ClientID的值發出到內聯腳本中（或者發出到腳本庫的代碼中）可能是較為棘手的，因為該ClientID必須插在字符串變量中的正確位置。以下實例使用轉義符將ClientID插入構成內聯腳本的字符串中。
| string element = "document.getElementById("" + ClientID + "")"; Page.RegisterArrayDeclaration("Page_Validators", element); |
另外，還可以使用String類的重載的Format方法撰寫使用ClientID的客戶端腳本。
4. 部署客戶端文件的方法
默認安裝的情況下，在wwwroot文件夾下存在一個子文件夾asp_client，其中保存了用于支持智能導航、驗證控件等功能的客戶端腳本文件。很顯然這些文件非常重要。為了提高應用的規范性，建議開發人員在部署客戶端文件過程中，采用以下方法。
· 將包含有客戶端腳本的文件夾置于asp_client文件夾中，尤其是對于那些安裝在全局配件緩存（GAC）中的控件更應該這樣做。
· 包含腳本的文件夾推薦使用與控件相關的名稱。
· 推薦在包含腳本的文件夾下不要直接放置腳本文件，而是再創建一個名稱為控件版本號的文件夾，將腳本文件放置其中。
例如，開發人員創建了一個版本為1.0的服務器控件MyControl，其關聯一個客戶端腳本ClientScript.js，并且將該控件加入了GAC中。這時推薦部署客戶端腳本文件的路徑為：c:Inetputwwwrootasp_clientMyControl_Client1.0ClientScript.js。另外，在客戶端文件庫中存儲的并不僅是腳本文件，也可以加入控件所需的樣式表文件、圖片等其他文件。
以上為部署客戶端文件的推薦方法，那么這是不是說明所有的客戶端腳本文件都需要遵循以上規則呢？當然不是。只要開發人員從實際出發，從提高程序的可維護性和方便性著眼，那么無論客戶端腳本文件置于何處，都是可以的。
5. 小結
本文主要介紹了與實現服務器控件客戶端功能相關的內容。這些內容對于開發出交互性強的服務器控件非常重要。掌握這些內容并不困難，真正困難的是如何開發完成客戶端功能的CSS文件、JS腳本、DHTML程序等。這些技術的掌握不是一朝一夕就可以完成的，它需要扎實的基礎，刻苦的鉆研。而所有這些技術和精神品質都是一名合格的開發人員所必需掌握的精髓，缺一不可。