一步一步教你 JS、控件封裝成類庫

ASP.NET 2.0允許將外部資源植入控件的裝配件里，通過一個指定的URL對其訪問.將外部p_w_picpaths文件, JavaScript 文件，CSS 文件植入控件的裝配件后，部署就容易了。這樣一來不僅可以實現對頁面的瘦身，還可以允許瀏覽器對該JavaScript文件施行緩存(這樣就不用每個頁面在登錄/回傳時向瀏覽器發送該JavaScript代碼了)

例子：（對TextBox控件進行擴充）

步驟1：新建一個類庫，名字叫NewTextBox

步驟2：新建一個類，名字改為NewTextBox.cs。新建一個js腳本，名字改為NewTextBox.js

步驟3：配置JS文件的屬性（將生成操作改為 簽入的資源）

------------------------------------------------------NewTextBox.cs

using System;
using System.Collections.Generic;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace NewTextBox
{
    //繼承TextBox類
    public class NewTextBox:TextBox
    {
        /// <summary>
        /// 重寫WebControl類中的虛方法
        /// </summary>
        /// <param name="writer"></param>
        protected override void AddAttributesToRender(HtmlTextWriter writer)
        {
            //給當前的控件（NewTextBox）加上一個事件（onkeydown="ChangeBackgroundColor(this)"）
            writer.AddAttribute("onkeydown", "ChangeBackgroundColor(this)");
            base.AddAttributesToRender(writer);
        }
        /// <summary>
        /// 重寫Control類中的虛方法(頁面呈現之前觸發。在Page_Load之后觸發)
        /// </summary>
        /// <param name="e"></param>
        protected override void OnPreRender(EventArgs e)
        {
            //注冊腳本文件                                      鍵          URL
            Page.ClientScript.RegisterClientScriptInclude("NewTextBox", Page.ClientScript.GetWebResourceUrl(this.GetType(), "NewTextBox.NewTextBox.js"));
            base.OnPreRender(e);
        }
    }
}

------------------------------------------------------NewTextBox.js

function ChangeBackgroundColor(ntb){

        var rand= Math.floor( Math.random()*1000000)

        ntb.style.background='#'+rand

        }

------------------------------------------------------AssemblyInfo.cs

using System.Reflection;
using System.Runtime.CompilerServices;
using System.Runtime.InteropServices;
using System.Web.UI;    //添加的命名空間
// 有關程序集的常規信息通過下列屬性集
// 控制。更改這些屬性值可修改
// 與程序集關聯的信息。
[assembly: AssemblyTitle("NewTextBox")]
[assembly: AssemblyDescription("")]
[assembly: AssemblyConfiguration("")]
[assembly: AssemblyCompany("http:/sdwm.org")]
[assembly: AssemblyProduct("NewTextBox")]
[assembly: AssemblyCopyright("版權所有 (C) http:/sdwm.org 2014")]
[assembly: AssemblyTrademark("")]
[assembly: AssemblyCulture("")]
// 將 ComVisible 設置為 false 使此程序集中的類型
// 對 COM 組件不可見。如果需要從 COM 訪問此程序集中的類型，
// 則將該類型上的 ComVisible 屬性設置為 true。
[assembly: ComVisible(false)]
// 如果此項目向 COM 公開，則下列 GUID 用于類型庫的 ID
[assembly: Guid("dd796ec9-d130-4195-a7ca-48decdd1d813")]
// 程序集的版本信息由下面四個值組成:
//
//      主版本
//      次版本 
//      內部版本號
//      修訂號
//
// 可以指定所有這些值，也可以使用“修訂號”和“內部版本號”的默認值，
// 方法是按如下所示使用“*”:
[assembly: AssemblyVersion("1.0.0.0")]
[assembly: AssemblyFileVersion("1.0.0.0")]

//添加的特性                   資源名稱（包括路徑），資源類型
[assembly: WebResource("NewTextBox.NewTextBox.js", "text/javascript")]

步驟4：在頁面中應用

            4.1：首先要在在項目中引用該類庫

            4.2：在頁面中注冊

步驟5：完成。預覽