<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    javaGrowing

      BlogJava :: 首頁 :: 新隨筆 :: 聯系 :: 聚合  :: 管理 ::
      92 隨筆 :: 33 文章 :: 49 評論 :: 0 Trackbacks
    從 ASP.NET 服務器控件插入客戶端腳本

    Scott Mitchell

    2003 年 8 月

    適用于:
        Microsoft? ASP.NET

    前提條件:本文假設讀者熟悉 ASP.NET。

    難度: 2

    摘要:盡管從技術角度講,ASP.NET 服務器控件的所有功能都可以在服務器端執行,但通常情況下通過添加客戶端腳本可以大大增強服務器控件的可用性。本文將探討服務器控件發送客戶端腳本的兩種方法,還將構建兩個使用這些技術的服務器控件:PopupGreeting,一個在首次加載的 Web 頁面上顯示帶有特定消息的客戶端模式對話框的服務器控件;ConfirmButton,一個增強的 Button Web 控件,如果用戶點擊此按鈕,則在發回 Web 窗體前向用戶顯示一個 JavaScript confirm() 的對話框。(本文包含一些指向英文站點的鏈接。)

    下載 InjectingClientSideScript.msi

    目錄

    簡介
    使用 RegisterStartupScript() 和 RegisterClientScriptBlock() 添加客戶端腳本塊
    探討 IsStartupScriptRegistered() 和 IsClientScriptBlockRegistered()
    從 ASP.NET 服務器控件發送客戶端腳本塊
    發送 ASP.NET 服務器 Web 控件的 HTML 屬性
    小結

    簡介

    盡管從技術角度講,Microsoft? ASP.NET 服務器控件的所有功能都可以在服務器端執行,但通常情況下通過添加客戶端腳本可以大大增強服務器控件的可用性。例如,ASP.NET 驗證 Web 控件可以在服務器端執行所有的驗證檢查。但是,對于高版本瀏覽器,驗證 Web 控件也會發送客戶端腳本,以在客戶端進行驗證。這就是說,這些瀏覽器的用戶可以獲得響應效果更好的動態體驗。

    在開發 ASP.NET 服務器控件時,您不妨問問自己,如何才能通過使用客戶端腳本來增強可用性。一旦找到可行的方案,其他要做的就是增強服務器控件的功能,以使其發送合適的客戶端腳本。

    ASP.NET 服務器控件可以發送兩種客戶端腳本:

    • 客戶端腳本塊
    • 客戶端 HTML 屬性

    客戶端腳本塊通常是用 JavaScript 編寫的,其中通常包含在發生特定的客戶端事件時執行的函數。客戶端 HTML 屬性提供將客戶端事件與客戶端腳本聯系在一起的方法。例如,以下的 HTML 頁面中包含了客戶端腳本塊,腳本塊中包含了名為 doClick() 的函數。該頁面同時還包含一個按鈕(通過 <input> HTML 元素創建),這個按鈕的 onclick 屬性與 doClick() 函數綁定。也就是說,只要用戶單擊該按鈕,就開始執行 doClick() 函數中的客戶端代碼。在本示例中,將顯示一個彈出式對話框(圖 1)。

    <html>
    <body>
    <form>
    <script language="JavaScript">
    <!--
    function doClick() {
    alert("You clicked me!");
    }
    // -->
    </script>

    <input type="button" onclick="doClick()" value="Click Me!" />
    </form>
    </body>
    </html>

    圖 1 是單擊“Click Me!”按鈕時 HTML 頁面的屏幕快照。

    圖 1:單擊“Click Me!”按鈕時顯示的彈出式對話框

    對于以上 HTML 頁面中的客戶端腳本,有幾點值得注意。首先,客戶端腳本塊包含在 HTML 注釋(<!---->)中。之所以這樣,是因為如果不將腳本塊放入 HTML 注釋中,那些不能識別腳本的舊式瀏覽器就會顯示 <script> 塊的內容。此外,還要注意,腳本塊中 HTML 注釋的結束標記前有一個 JavaScript 注釋,即 //。這是因為舊版本的 Netscape 在遇到 --> 時,會拋出 JavaScript 分析異常,因此必須將其注釋掉。幸運的是,現代的瀏覽器已不需要這一額外操作,所以在為 Intranet 或其他由瀏覽器控制的環境開發 Web 頁面時,您就不必采取此類預防措施了。

    如果您對客戶端腳本不是很熟悉,alert(string) 函數的作用就是顯示一個模式彈出式對話框,對話框中包含的消息由 string 參數指定。所有 HTML 元素都有若干個可以綁定一段客戶端 JavaScript 代碼的客戶端屬性(例如,onclickonmouseoveronmouseoutonfocusonblur 等等)。例如,在上面的 HTML 頁面中,<input> 元素的 onclick 屬性綁定到 doClick() 函數,因此在單擊該按鈕時將執行 doClick() 函數。有關 JavaScript 事件及其關聯的 HTML 屬性的列表,請參閱 Introduction to Dynamic HTML 一文。有關客戶端 JavaScript 的詳細信息,請參閱 HTML and Dynamic HTML 一文。

    在本文中,我們將學習如何在 ASP.NET 服務器控件中發送客戶端腳本塊和 HTML 元素屬性。我們首先討論如何使用 System.Web.UI.Page 類中的兩個方法來向 ASP.NET Web 頁面添加客戶端腳本塊,這兩個方法是 RegisterStartupScript()RegisterClientScriptBlock()。 掌握這一知識后,我們將構建一個簡單的服務器控件,讓這個控件在每次加載頁面時顯示一個客戶端彈出式對話框。之后,我們再來了解如何將 HTML 屬性添加到 ASP.NET 服務器控件的 HTML 元素。最后,我們將歸納所有知識,實際構建一個 ConfirmButton Web 控件,當單擊這個控件時,將向用戶提示一個對話框,詢問用戶是否要繼續。

    使用 RegisterStartupScript() 和 RegisterClientScriptBlock() 添加客戶端腳本塊

    System.Web.UI.Page 類包含的兩個方法可以將客戶端腳本代碼發送到由 ASP.NET Web 頁面提供的 HTML 中:

    • RegisterStartupScript(key, script)
    • RegisterClientScriptBlock(key, script)

    這兩個方法都接受兩個字符串作為輸入。第二個參數 script 是要插入到頁面中的客戶端腳本,包括 <script> 的起始標記和終止標記。第一個參數 key 是插入的客戶端腳本的唯一標識符。

    這兩個方法唯一的不同之處在于從“何處”發送腳本塊。RegisterClientScriptBlock() 在 Web 窗體的開始處(緊接著 <form runat="server"> 標識之后)發送腳本塊,而 RegisterStartupScript() 在 Web 窗體的結尾處(在 </form> 標識之前)發送腳本塊。

    為什么會有兩種不同的方法來發送客戶端腳本?要更好地了解這一點,我們必須首先了解,客戶端腳本可以分為兩類:一類是在加載頁面后立即運行的代碼, 一類是在發生某些客戶端事件時才運行的代碼。前者的常見示例是將焦點設置到文本框的客戶端代碼。例如,當您訪問 Google 時,在頁面加載后就會執行一小段客戶端代碼,以自動將焦點設置到搜索文本框。

    以下是后一類代碼(為響應客戶端事件而運行的代碼)的示例。具體而言,在該示例中,單擊按鈕時將顯示一個彈出式對話框:

    <html>
    <body>
    <form>
    <script language="JavaScript">
    <!--
    function displayPopup() {
    alert("Hello, world.");
    }
    // -->
    </script>

    <input type="button" value="Click Me!" onclick="displayPopup()" />
    </form>
    </body>
    </html>

    在這段代碼中,<input> 標記中的 onclick="displayPopup()" 用于指明在單擊按鈕時,JavaScript 函數 displayPopup() 應該運行。

    RegisterStartupScript() 方法可用于添加要在加載頁面后運行的腳本塊。通過這種方法添加的腳本塊位于 Web 窗體的結尾處,因為必須在腳本運行前定義腳本要修改的 HTML 元素。也就是說,如果您要使用客戶端腳本將焦點設置到文本框,必須確保文本框的 HTML 標記位于設置該文本框的焦點的腳本之前。例如,下面的 HTML 將顯示一個文本框,并將焦點設置到該文本框:

    <input type="text" id="myTextBox" />

    <script language="JavaScript">
    <!--
    document.getElementById("myTextBox").focus();
    // -->
    </script>

    相反,以下 HTML 不會將焦點設置到文本框,因為文本框是在腳本塊“之后”定義的:

    <script language="JavaScript">
    <!--
    document.getElementById("myTextBox").focus();
    // -->
    </script>

    <input type="text" id="myTextBox" />

    因此,RegisterStartupScript() 方法將 <script> 塊置于 Web 窗體的結尾處,以保證在執行客戶端腳本之前已聲明 Web 窗體中的所有 HTML 元素。

    RegisterClientScriptBlock() 方法用于為響應客戶端事件而執行的腳本代碼。通過此方法發送的腳本塊位于 Web 頁面的開始處,因為這種方法不要求將腳本塊置于所有 HTML 元素之后。

    探討 IsStartupScriptRegistered() 和 IsClientScriptBlockRegistered()

    RegisterStartupScript()RegisterClientScriptBlock() 方法之外,Page 類還包含兩個在發送客戶端腳本時常用的輔助方法:

    • IsStartupScriptRegistered(key)
    • IsClientScriptBlockRegistered(key)

    如上所述,在使用 RegisterStartupScript()RegisterClientScriptBlock() 插入客戶端腳本塊時,提供了一個唯一標識腳本塊的關鍵字。這兩個方法都接受一個輸入(字符串 key),并返回一個布爾值,以指示帶有指定關鍵字的腳本塊是否已添加到頁面中。具體地說,如果帶有特定 key 的腳本塊已經注冊,這些方法將返回 True,否則將返回 False。

    要了解如何使用這兩個方法,可以看一看 ASP.NET 驗證 Web 控件,如 RequiredFieldValidator、RegularExpressionValidator 等等。這些控件都會用到一個常用的驗證 JavaScript 文件 (WebValidation.js),該文件位于 ASP.NET Web 應用程序的 aspnet_client/system_web/版本號 目錄中。因此,所有這些控件都會發送相同的腳本塊,這個腳本塊將調用在 WebValidation.js 文件中定義的相應的 JavaScript 函數,以啟動客戶端的驗證過程。要完成這個過程,這些控件會使用 Page 類的 RegisterClientScriptBlock() 方法,并使用關鍵字 ValidatorIncludeScript

    接下來要考慮的是,如果一個 ASP.NET Web 頁面中包含多個驗證 Web 控件,會出現什么情況呢?所有這些 Web 控件都要使用相同的關鍵字發送相同的腳本塊。如果使用這個關鍵字調用兩次 RegisterClientScriptBlock()RegisterStartupScript() 方法,則第二次調用會被認為是復制腳本塊而被忽略。因此,即使一個 Web 頁面上有多個驗證控件,也只是發送一個公共腳本塊的實例。但是,請注意,除第一個控件之外的其他所有驗證 Web 控件都會構建要發送的公共客戶端腳本,而這只是在浪費時間。

    這時就應該使用 IsClientScriptBlock()IsStartupScript() 方法。這樣一來,驗證 Web 控件就不會先花時間構建要發送的客戶端代碼,而是先檢查是否已經存在使用關鍵字 ValidatorIncludeScript 注冊的腳本。如果存在,控件就會放棄構建客戶端腳本塊,因為腳本塊已經由頁面上的其他驗證控件構建了。

    因此,每次構建客戶端腳本時,應該首先調用 IsClientScriptBlock()IsStartupScript() 方法,以確定是否需要生成客戶端腳本。在下面一節,我們將看到一些示例,在這些示例中,IsClientScriptBlock()IsStartupScript() 方法先后與 RegisterClientScriptBlock()RegisterStartupScript() 方法結合使用。

    從 ASP.NET 服務器控件發送客戶端腳本塊

    請記住,RegisterStartupScript()RegisterClientScriptBlock() 方法是 System.Web.UI.Page 類的方法。幸運的是,可以容易地從 ASP.NET 服務器控件調用這兩個方法,因為 System.Web.UI.Control 類(所有 ASP.NET 服務器控件都直接或間接地從這個類導出)有一個包含對 Page 實例的引用的 Page 屬性,而這個 Page 實例包含服務器控件。因此,要從 ASP.NET 服務器控件添加客戶端腳本塊,您只需使用下面的語法:

    this.Page.RegisterClientScriptBlock(key, script);

    通常,添加客戶端腳本塊這個任務會使用 OnPreRender() 方法來處理,這個方法在控件生命周期的預呈現階段執行。

    讓我們創建一個只顯示客戶端彈出式對話框的 ASP.NET 服務器控件。此示例將說明構建一個發送客戶端腳本的控件是很容易的。

    首先,在 Microsoft? Visual Studio? .NET 中創建一個新的 Web Control Library(Web 控件庫)項目。這將創建一個只有一個類的新項目,這個類從 System.Web.UI.WebControls.WebControl 導出。但是,我們希望這個類從 System.Web.UI.Control 類導出。為什么呢?因為 WebControl 類用于支持顯示為 HTML 元素的服務器控件,而 Control 類則用于不會顯示為 HTML 元素的服務器控件。

    大多數內置的 ASP.NET 服務器控件都會發送一個 HTML 元素。例如,TextBox Web 控件發送一個 <input> 元素,其類型屬性設置為 text;DataGrid Web 控件發送一個 <table> 元素,為每條要顯示的記錄發送 <tr> 元素,為每個字段發送 <td> 列。但是,不是所有的控件都需要發送 HTML 元素。例如,Literal 控件只是按原樣輸出它的 Text 屬性,而不將這個屬性放在 HTML 元素中。同樣,Repeater 也不將其輸出放在 HTML 元素中。那些顯示為 HTML 元素的服務器控件,如 TextBox、Button、DataGrid 等等,是從 System.Web.UI.WebControls.WebControl 類導出的,而那些產生 HTML 元素的控件,如 Literal、Repeater 等,是從 System.Web.UI.Control 類導出的。

    既然我們要創建的服務器控件不可見(它只是發送一個顯示彈出式控件的客戶端腳本塊),這個控件最好從 System.Web.UI.Control 導出,而不是從 System.Web.UI.WebControls.WebControl 導出。

    這個控件只需要兩個屬性:

    • PopupMessage - 表示要在彈出式對話框中顯示的消息的字符串。
    • Enabled - 表示是否啟用控件的布爾值。如果啟用控件,則顯示彈出式對話框,否則不顯示。(必須添加一個 Enabled 屬性,是因為導出該控件的 Control 類不包括 Enabled 屬性,此屬性只是隱含地由那些從 WebControl 導出的控件使用。)

    除了這兩種屬性之外,我們需要覆蓋 OnPreRender() 方法。在這里,我們需要調用 RegisterStartupScript(),并傳遞控件唯一的關鍵字和恰當的客戶端腳本以顯示彈出式對話框。這個類的完整代碼如下所示:

    using System;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.ComponentModel;

    namespace ClientSideScript
    {
    /// <summary>
    /// WebCustomControl1 的摘要描述。
    /// </summary>
    [DefaultProperty("Text"),
    ToolboxData("<{0}吐舌笑臉opupGreeting runat=server></{0}吐舌笑臉opupGreeting>")]
    public class PopupGreeting : System.Web.UI.Control
    {
    [Bindable(true),
    Category("Appearance"),
    DefaultValue("")]
    public string PopupMessage
    {
    get
    {
    // 檢查 ViewState 中是否存在該項目
    object popupMessage = this.ViewState["PopupMessage"];
    if (popupMessage != null)
    return this.ViewState["PopupMessage"].ToString();
    else
    return "Welcome to my Web site!";
    }

    set
    {
    // 指定 ViewState 變量
    ViewState["PopupMessage"] = value;
    }
    }

    [Bindable(true),
    Category("Appearance"),
    DefaultValue("")]
    public bool Enabled
    {
    get
    {
    // 檢查 ViewState 中是否存在該項目
    object enabled = this.ViewState["Enabled"];
    if (enabled != null)
    return (bool) this.ViewState["Enabled"];
    else
    return true;
    }

    set
    {
    // 指定 ViewState 變量
    ViewState["Enabled"] = value;
    }
    }


    protected override void OnPreRender(EventArgs e)
    {
    base.OnPreRender電子郵件;

    string scriptKey = "intoPopupMessage:" + this.UniqueID;

    if (!Page.IsStartupScriptRegistered(scriptKey) && this.Enabled &&
    !Page.IsPostBack)
    {
    string scriptBlock =
    @"<script language=""JavaScript"">
    <!--
    alert(""%%POPUP_MESSAGE%%"");
    // -->
    </script>";
    scriptBlock = scriptBlock.Replace("%%POPUP_MESSAGE%%", this.PopupMessage);

    Page.RegisterStartupScript(scriptKey, scriptBlock);
    }
    }
    }
    }

    請記住下面兩件事:首先,EnabledPopupMessage 屬性保存在 ViewState 中,這樣在回傳時這些值可以始終保持一致; 其次,在 OnPreRender() 方法中,用于腳本塊的關鍵字是文本 intoPopupMessage: 加上控件的 UniqueID 屬性。如果使用一個硬編碼的關鍵字,則當頁面中有多個控件時,只有第一個控件能夠注冊其腳本塊,因此只顯示一個彈出式對話框。通過在腳本塊關鍵字中使用 UniqueID,就能保證該控件的每個實例都能獲取其腳本塊。

    在注冊腳本塊之前,代碼首先檢查三個條件:

    1. 沒有使用同一關鍵字注冊的腳本。這當然是不可能的,因為每個控件實例都應該有一個 UniqueID 屬性值。但是,不妨先練習使用 IsStartupScriptRegistered() 方法,然后再花時間創建和注冊啟動腳本。
    2. 控件的 Enabled 屬性為 True。
    3. 頁面沒有被回傳。這段代碼只允許彈出式對話框在第一次加載頁面時顯示,而不是在每次回傳頁面時都顯示。我們還可以增添更為靈活的功能,即為該控件添加一個布爾屬性,以允許用戶指定是否在回傳時也生成彈出式對話框。

    如果滿足這三個條件,則腳本被指定,并且 PopupMessage 屬性值被插入到腳本中適當的位置。最后,調用 Page 屬性的 RegisterStartupScript() 方法,傳入關鍵字及腳本代碼。

    PopupGreeting 代碼可以從本文結尾處提供的下載中獲得。該下載包括名為 ClientSideControlsAndTester 的 Visual Studio .NET 解決方案,其中包含兩個項目:

    • ClientSideControls,包含 PopupGreeting 服務器控件
    • ClientSideTester,包括一個為測試 ClientSideControls 而設計的 ASP.NET Web 應用程序

    ClientSideControls 項目編譯后的程序集名為 ClientSideControls.dll。要在您自己的 ASP.NET Web 應用程序中使用 PopupGreeting 服務器控件,請將 ClientSideControls.dll 文件添加到您的 Web 應用程序的引用中。然后,在設計器中,右鍵單擊 Toolbox(工具箱)并選擇“Add/Remove Items . . .”(添加/刪除項),再次選擇 ClientSideControls.dll 文件。這樣就向 Toolbox(工具箱)中添加了名為 PopupGreeting 的新項。然后,您可以從 Toolbox(工具箱)將該控件拖到設計器中。

    圖 2 顯示了 PopupGreeting 控件添加到 Toolbox(工具箱)并添加到設計器后,Visual Studio .NET 的屏幕快照。Toolbox(工具箱)中的 PopupGreeting 控件用紅色線圈出,設計器中的 PopupGreeting 輸出用藍色線圈出,在屏幕快照右側的“Properties”(屬性)窗格中可以查看 PopupGreeting 的屬性。

    圖 2:PopupGreeting 服務器控件已添加到 ASP.NET Web 窗體頁面

    發送 ASP.NET 服務器 Web 控件的 HTML 屬性

    如上所述,有兩種方法可以通過服務器控件發送客戶端腳本:

    • 通過使用客戶端腳本塊
    • 通過 HTML 元素屬性

    在上一節中,我們探討了如何使用 Page 類的 RegisterStartupScript()RegisterClientScriptBlock() 方法向 ASP.NET Web 頁面添加客戶端腳本塊。在最后這一節,我們了解如何將 HTML 元素屬性添加到服務器控件的 HTML 元素。

    在開始之前,請注意這種方法通常只適用于從 System.Web.UI.WebControls.WebControl 類導出的服務器控件,因為從這個類導出的控件會發送某些 HTML 元素。不發送 HTML 元素的服務器控件(如上一節中的 PopupGreeting 服務器控件),則不必寫出 HTML 元素屬性,因為這些控件運行時不會寫出 HTML 元素。

    WebControl 類包含一個將 HTML 元素屬性添加到由 Web 控件發出的 HTML 元素的方法。該方法稱為 AddAttributesToRender(),它只有一個輸入參數,即 HtmlTextWriter 的實例。要向 Web 控件添加 HTML 屬性,您可以使用 HtmlTextWriter 的以下兩個方法之一:

    • AddAttribute()
    • AddStyleAttribute()

    AddAttribute() 方法用于將 titleclassstyleonclick 等 HTML 屬性添加到 HTML 元素。AddStyleAttribute() 用于將樣式設置添加到 HTML 元素,如 background-colorcolorfont-size 等。

    AddAttribute() 有幾個重載窗體,但在代碼中,我們將使用以下窗體:AddAttribute(HtmlTextWriterAttribute, value)。第一個參數,即 HtmlTextWriterAttribute,應該是 HtmlTextWriterAttribute 枚舉的成員。該枚舉包含像 AlignBgcolorClassOnclick 等項。您可以在 .NET Framework Class Library,HtmlTextWriterAttribute Enumeration 中找到完整的列表。value 輸入參數用于指定分配給特定 HTML 屬性的值。最后,如果您想添加一個 HtmlTextWriterAttribute 枚舉中未定義的 HTML 屬性,可以使用 AddAttribute() 方法的替代形式 AddAttribute(attributeName, value),其中的 attributeNamevalue 均為字符串。

    為了運用該信息,我們創建一個作為確認按鈕的服務器 Web 控件。確認按鈕是一種提交按鈕,當用戶單擊此按鈕時,將顯示一個彈出式對話框,詢問用戶是否確定要繼續操作。用戶可以單擊“取消”,不提交窗體。此項功能 對用于刪除信息的按鈕特別有用,因為最終用戶(或網站管理員)可能會在無意中單擊鼠標刪除數據庫中的條目,如果沒有機會取消,將是非常令人煩惱的事。

    為了減少工作量,我們從 System.Web.UI.WebControls.Button 類中導出 ConfirmButton Web 控件,因為這個類本身已完成了涉及呈現提交按鈕的所有繁重工作。在導出的類中,我們只需添加一個屬性,這樣用戶可以指定確認消息,然后覆蓋按鈕的 AddAttributesToRender() 方法,并添加一個屬性以處理客戶端事件 onclick

    首先,在 Visual Studio .NET 中創建一個新的 Web Control Library(Web 控件庫)項目,或者在 ClientSideControls 項目中添加一個新的 Web Custom Control(Web 自定義控件)。ConfirmButton 類的完整源代碼如下所示:

    using System;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.ComponentModel;

    namespace ClientSideControls
    {
    /// <summary>
    /// ConfirmButton 的摘要描述。
    /// </summary>
    [DefaultProperty("Text"),
    ToolboxData("<{0}:ConfirmButton runat=server></{0}:ConfirmButton>")]
    public class ConfirmButton : Button
    {
    [Bindable(true),
    Category("Appearance"),
    DefaultValue("")]
    public string PopupMessage
    {
    get
    {
    // 檢查 ViewState 中是否存在該項目
    object popupMessage = this.ViewState["PopupMessage"];
    if (popupMessage != null)
    return this.ViewState["PopupMessage"].ToString();
    else
    return "Are you sure you want to continue?";
    }

    set
    {
    // 指定 ViewState 變量
    ViewState["PopupMessage"] = value;
    }
    }


    protected override void AddAttributesToRender(HtmlTextWriter writer)
    {
    base.AddAttributesToRender(writer);

    string script = @"return confirm(""%%POPUP_MESSAGE%%"");";
    script = script.Replace("%%POPUP_MESSAGE%%",
    this.PopupMessage.Replace("\"", "\\\""));

    writer.AddAttribute(HtmlTextWriterAttribute.Onclick, script);
    }
    }
    }

    首先要注意的是,ConfirmButton 類是從 Button 類導出的。由于 Button 類已包含 Button Web 控件使用的所有屬性和方法,因此我們所做的只是添加屬性和方法,以在用戶單擊按鈕時顯示一個確認對話框。現在我們需要一個屬性,即 PopupMessage, 它是要在確認彈出式對話框中顯示的消息。默認情況下,這條消息是“Are you sure you want to continue?”(您確定要繼續嗎?)如果使用 ConfirmButton 來確認刪除,可能需要將該消息更改為“This action will permanently delete the selected item. Are you sure you want to do this?”(此操作將永久刪除所選項。您確定要繼續嗎?)

    我們只需覆蓋一個方法,即 AddAttributesToRender()。在此方法中,我們只要構建當觸發 <input> 元素的 onclick 事件時要執行的客戶端 JavaScript,然后通過傳入的 HtmlTextWriter 對象的 AddAttribute() 方法添加這段 JavaScript。關于這個方法,有一點要注意,必須將 PopupMessage 屬性值中的所有雙引號實例替換為轉義雙引號(即 \")。另外還要注意,默認情況下,AddAttribute() 會對第二個參數中的字符進行 HTML 編碼。也就是說,ASP.NET Web 頁面中如果包含 PopupMessage 屬性被設置為“Do you want to continue?”(要繼續嗎?)的 ConfirmButton,該頁面將發送以下 HTML 標記:

    <input type="submit" name="ConfirmButton1" 
    value="Click Me!" id="ConfirmButton1" onclick="return confirm
    (&quot;Do you want to continue?&quot眨眼笑臉;" />

    如果您不熟悉 JavaScript 的 confirm(string) 函數,那么請您注意,該函數只接受一個字符串參數,并顯示一個帶有特定字符串的模式對話框。該對話框中包含兩個按鈕:“確定”和“取消”。如果單擊“確定”,confirm() 函數返回 True,否則返回 False。請注意,onclick 事件將返回 confirm() 函數調用的結果。當通過單擊提交按鈕來提交表單時,如果提交按鈕的 onclick 事件返回 False,則表單未被提交。因此,只有在用戶確認后,可以使用 confirm() 函數提交表單。有關 confirm() 的詳細信息,請參閱 ASP Warrior 網站中的 Javascript Confirm Form Submission

    圖 3:操作中的 ConfirmButton

    ConfirmButton 在按鈕的 onclick 事件處理程序中使用了內嵌的 JavaScript,還可以在 ConfirmButton 的 OnPreRender() 方法的客戶端腳本塊中創建一個函數,然后調整 onclick 屬性以調用該函數。

    小結

    在本文中,我們探討了兩種通過 ASP.NET 服務器控件插入客戶端腳本的方法。第一種方法是使用 Page 類的 RegisterStartupScript()RegisterClientScriptBlock() 方法插入客戶端腳本塊。第二種方法是向 HTML 元素的屬性添加客戶端腳本。后者通過覆蓋 Web 服務器控件的 AddAttributesToRender() 方法,并使用 HtmlTextWriterAddAttribute() 方法來完成。

    我們還在文中介紹了兩個簡單的服務器控件,它們都利用了客戶端腳本來改進其功能。PopupGreeting 控件在頁面首次加載時顯示一個模式彈出式對話框,ConfirmButton Web 控件在用戶單擊按鈕提交表單時,提示用戶進行確認。

    您可以在自己的服務器控件中插入客戶端腳本,這將顯著改善用戶體驗。本文提供的兩個服務器控件相對比較簡單,在可用性和獨創性上沒有什么突出之處。MetaBuilders.com 中展示了很多利用從 ASP.NET 服務器控件中插入客戶端腳本而實現的功能,這些功能會給您留下深刻印象。在 MetaBuilders.com,您可以找到一些服務器控件,它們有的可以自動將焦點添加到文本框,有的可以在兩個下拉列表之間傳遞條目,有的可以向下 拉列表中添加或刪除條目,還有的可以在一系列下拉列表中顯示父子關系的數據,等等。最大的好處是,這些控件是免費的,并包括完整的源代碼。

    祝大家編程快樂!

    作者簡介

    Scott Mitchell 著有五本關于 ASP/ASP.NET 的書籍,是 4GuysFromRolla.com 網站的創始人,過去五年來一直從事 Microsoft Web 技術方面的研究。Scott 是 ASP 和 ASP.NET 社區非常活躍的一名成員,十分熱愛 ASP 和 ASP.NET 技術,并非常愿意幫助其他人了解這些令人振奮的技術。有關 DataGrid、DataList 和 Repeater 控件的詳細信息,請參閱 Scott 的著作《ASP.NET Data Web Controls Kick Start》(ISBN 為 0672325012)。

    推薦鏈接:

    posted on 2006-01-05 15:14 javaGrowing 閱讀(288) 評論(0)  編輯  收藏 所屬分類: asp.net

    只有注冊用戶登錄后才能發表評論。


    網站導航:
     
    主站蜘蛛池模板: 亚洲午夜成人精品无码色欲| 亚洲自偷自偷图片| 亚洲AV无码国产精品色| 最近中文字幕高清免费中文字幕mv | 无码不卡亚洲成?人片| 99久久99热精品免费观看国产| 伊人久久综在合线亚洲91 | 久久这里只精品99re免费| 国产亚洲综合色就色| 久久大香香蕉国产免费网站| 午夜亚洲国产理论秋霞| 免费看片在线观看| 中文字幕乱码亚洲无线三区| 日韩中文无码有码免费视频| 国产亚洲福利一区二区免费看| 日产国产精品亚洲系列| 一级特黄色毛片免费看| 亚洲国产精品福利片在线观看| 毛片无码免费无码播放| 亚洲中字慕日产2021| 精品国产一区二区三区免费看| 日本一区二区在线免费观看 | 91香蕉在线观看免费高清| 亚洲人成免费电影| 男女交性永久免费视频播放| 成人久久久观看免费毛片| 亚洲伊人色欲综合网| 亚洲三级在线免费观看| 日韩国产精品亚洲а∨天堂免| 国产精品亚洲精品日韩已方| 外国成人网在线观看免费视频| 亚洲午夜成激人情在线影院| 四虎影视永久免费观看地址| 国产中文字幕在线免费观看| 亚洲欧洲校园自拍都市| 四只虎免费永久观看| 97视频免费观看2区| 久久亚洲欧美国产精品| 亚洲av日韩av不卡在线观看| 好吊妞998视频免费观看在线| 久久精品成人免费观看97|