封装JS文件到DLL中并在页面中调用

最新推荐文章于 2024-08-13 08:49:24 发布

my98800

最新推荐文章于 2024-08-13 08:49:24 发布

阅读量4.1k

点赞数

分类专栏： ASP.Net

ASP.Net 专栏收录该内容

258 篇文章 2 订阅

订阅专栏

通常在ASP.NET,我们常常会用到JS脚本来实现页面上的很多操作。在页面中引用JS的方法也是有好几种。

这里来介绍一下，如何将JS脚本内嵌到组件(Assembly)中，即DLL中。这样的做法最大的好处就是能够保护JavaScript文件的内容，避免JavaScript类的定义被修改。

下面就以一个示例来讲解如何操作：

1.打开VS，新建一个WebApplication1项目[这里新建网站也可以]，采用默认设置。

2.在当前解决方案中添加新项目。（类库： JSLib），如图：

Add New Solution

添加后，默认的会有一个Class.cs文件，我们将其重命名为：【ReferenceClientScript.cs】，这在后面我们会用它。

3.由于新建的是类库，所以要添加引用：System.Web，这在后我们会用到。

4.在JSLib中添加一个JS文件，取默认设置。自动有一个JScript1.js文件。

5.编写JS脚本【JScript.js】。

我们这里只是一个简单的演示，所以脚本代码尽量简单。Hello，World！，一段最简单的类，目的在演示，当然你可以写的更复杂些。

JSScript.js 代码：

 
        function  
        Hello()   
       
        {   
       
        alert( 
        "Hello,world!" 
        );   
       
        }

6.设置JScript.js属性->生成操作为【嵌入的资源】，如图：

设置属性

7.在JSLib项目的AssemblyInfo.cs文件最后添加一行代码：【注意JSLib.JScript1.js，JSLib是js所在项目的命名空间】

 
        [assembly: WebResource( 
        "JSLib.JScript1.js" 
        , 
        "text/javascript" 
        )]

8.编写JS脚本注册类【ReferenceClientScript.cs】。

ReferenceClientScript.cs 代码：

 
        using  
        System;   
       
        using  
        System.Collections.Generic;   
       
        using  
        System.Linq;   
       
        using  
        System.Text;   
       
        namespace  
        JSLib   
       
        {   
       
        public  
        class  
        ReferenceClientScript : System.Web.UI.WebControls.WebControl    
       
        {   
       
        protected  
        override  
        void  
        OnPreRender(EventArgs e)    
       
        {   
       
        if  
        ( 
        this 
        .Page !=  
        null 
        )   
       
        {   
       
        ClientScriptManager manager =  
        this 
        .Page.ClientScript;   
       
        manager.RegisterClientScriptResource( 
        typeof 
        (ReferenceClientScript), 
        "JSLib.JScript1.js" 
        );   
       
        }   
       
        base 
        .OnPreRender(e);   
       
        }   
       
        }   
       
        }

9.在WebApplication1中添加项目引用。编译后生成JSLib.dll

10.在要调用脚本的页面注册JSLib.dll

 
        <%@ Register Assembly= 
        "JSLib"  
        Namespace= 
        "JSLib"  
        TagPrefix= 
        "JSLibInstance"  
        %>

11.引用脚本。

 
        <%@ Page Language= 
        "C#"  
        AutoEventWireup= 
        "true"  
        CodeBehind= 
        "Default.aspx.cs"  
        Inherits= 
        "WebApplication1._Default"  
        %>   
       
        <%@ Register Assembly= 
        "JSLib"  
        Namespace= 
        "JSLib"  
        TagPrefix= 
        "JSLibInstance"  
        %>   
       
        <!DOCTYPE html PUBLIC  
        "-//W3C//DTD XHTML 1.0 Transitional//EN"  
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" 
        >   
       
        <html xmlns= 
        "http://www.w3.org/1999/xhtml"  
        >   
       
        <head runat= 
        "server" 
        >   
       
        <title>无标题页</title>   
       
        </head>   
       
        <body>   
       
        <form id= 
        "form1"  
        runat= 
        "server" 
        >   
       
        <asp:ScriptManager ID= 
        "ScriptManager1"  
        runat= 
        "server" 
        >   
       
        </asp:ScriptManager>   
       
        <div>       
       
        <JSLibInstance:ReferenceClientScript id= 
        "js1"  
        runat= 
        "server" 
        ></JSLibInstance:ReferenceClientScript>   
       
        JS封装到DLL 并在页面调用 Demo。<br />    
       
        <input id= 
        "Button1"  
        type= 
        "button"  
        value= 
        "button"  
        onclick= 
        "Hello();"  
        />   
       
        </div>   
       
        </form>   
       
        </body>   
       
        </html>

12.最后完成效果图：

执行后的结果

13.执行时的html代码:

 
        <!DOCTYPE html PUBLIC  
        "-//W3C//DTD XHTML 1.0 Transitional//EN"  
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" 
        > 
       
        <html xmlns= 
        "http://www.w3.org/1999/xhtml"  
        > 
       
        <head><title> 
       
        JS封装到DLL 并在页面调用--Vicent_Ren制作【20100619】 
       
        </title></head> 
       
        <body> 
       
        <form name= 
        "form1"  
        method= 
        "post"  
        action= 
        "default.aspx"  
        id= 
        "form1" 
        > 
       
        <div> 
       
        <input type= 
        "hidden"  
        name= 
        "__EVENTTARGET"  
        id= 
        "__EVENTTARGET"  
        value= 
        ""  
        /> 
       
        <input type= 
        "hidden"  
        name= 
        "__EVENTARGUMENT"  
        id= 
        "__EVENTARGUMENT"  
        value= 
        ""  
        /> 
       
        <input type= 
        "hidden"  
        name= 
        "__VIEWSTATE"  
        id= 
        "__VIEWSTATE"  
        value= 
        "/wEPDwUKLTI1NDU3ODUzNmRk4W+ydFv9SuBMv4K7vgVzdYPo0yM="  
        /> 
       
        </div> 
       
        <script type= 
        "text/javascript" 
        > 
       
        //<![CDATA[ 
       
        var  
        theForm = document.forms[ 
        'form1' 
        ]; 
       
        if  
        (!theForm) { 
       
        theForm = document.form1; 
       
        } 
       
        function __doPostBack(eventTarget, eventArgument) { 
       
        if  
        (!theForm.onsubmit || (theForm.onsubmit() !=  
        false 
        )) { 
       
        theForm.__EVENTTARGET.value = eventTarget; 
       
        theForm.__EVENTARGUMENT.value = eventArgument; 
       
        theForm.submit(); 
       
        } 
       
        } 
       
        //]]> 
       
        </script> 
       
        <script src= 
        "/WebResource.axd?d=MeTYUe2Nli7DPmsx9J92AA2&t=634130563674375000"  
        type= 
        "text/javascript" 
        ></script> 
       
        <script src= 
        "/WebResource.axd?d=oJeV8gYSmjAsGIcbJV7ux0vxGpRb1JuUde0qLBlln9w1&t=634125776275000000"  
        type= 
        "text/javascript" 
        ></script> 
       
        <script src= 
        "/ScriptResource.axd?d=PpmY9YsXYmWQq6liGNs5LuMNLtDhVsvPqe3CTCI27BNLCLfislppBnoCcro5r89BmQs8Z6mSbRu0fueDIrPViqaI6EEX1sZEHY62mtMOG401&t=7528725e"  
        type= 
        "text/javascript" 
        ></script> 
       
        <script type= 
        "text/javascript" 
        > 
       
        //<![CDATA[ 
       
        if  
        ( 
        typeof 
        (Sys) ===  
        'undefined' 
        ) 
        throw  
        new  
        Error( 
        'ASP.NET Ajax 客户端框架未能加载。' 
        ); 
       
        //]]> 
       
        </script> 
       
        <script src= 
        "/ScriptResource.axd?d=PpmY9YsXYmWQq6liGNs5LuMNLtDhVsvPqe3CTCI27BNLCLfislppBnoCcro5r89B2_2hfD_INFLf_4YMWHp_uBVtM5vU0n-iwdEQPsPYEUfC55rQ0ianvg9jVuNBrGWr0&t=7528725e"  
        type= 
        "text/javascript" 
        ></script> 
       
        <script type= 
        "text/javascript" 
        > 
       
        //<![CDATA[ 
       
        Sys.WebForms.PageRequestManager._initialize( 
        'ScriptManager1' 
        , document.getElementById( 
        'form1' 
        )); 
       
        Sys.WebForms.PageRequestManager.getInstance()._updateControls([], [], [], 90); 
       
        //]]> 
       
        </script> 
       
        <div>    
       
        <span id= 
        "js1" 
        ></span> 
       
        JS封装到DLL 并在页面调用 Demo。<br /> 
       
        <input id= 
        "Button1"  
        type= 
        "button"  
        value= 
        "button"  
        onclick= 
        "Hello();"  
        /> 
       
        </div> 
       
        <script type= 
        "text/javascript" 
        > 
       
        //<![CDATA[ 
       
        Sys.Application.initialize(); 
       
        //]]> 
       
        </script> 
       
        </form> 
       
        </body> 
       
        </html>