Asp.Net Ajax 学习笔记23 利用Microsoft AJAX Library开发客户端组件(上)

本文介绍了 ASP.NET AJAX 框架中 Sys.Component 类及其派生类的基本使用方法,包括如何创建组件、初始化及销毁过程,并给出了一个简单的示例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Asp.Net Ajax框架已经为我们提供了组件的设计模型

  • Sys.Component:组件的基类,他实现了下面三个接口
  • Sys.IDisposable:组件的销毁接口
  • Sys.INotifyDisposing:组件销毁的通知接口
  • Sys.INotifyPropertyChange:组件属性改变的通知接口

下面是这些基类和接口的成员说明

Sys.Component
get_events()得到组件的事件列表
get_id()/set_id()得到/设置组件的ID
get_isInitialized()得到组件是否已经初始化
initiialize()组件的初始化方法
dispose()组件的销魂方法
raisePropertyChanged()抛出组件属性改变事件的方法
Sys.IDisposable
dispose()组件销魂调用的方法
Sys.INotifyDisposing
add_disposing添加组件正在销毁中的事件处理器
remove_disposing移除组件正在销魂中的事件处理器
Sys.INotifyPropertyChange
add_propertyChanged()添加组件属性改变的事件处理器
remove_disposing移除组件属性改变的事件处理器

Sys.Component下有两个派生类

  • Sys.UI.Control:封装DOM元素,概念上为一个(组合)控件
  • Sys.UI.Behavior:扩展DOM元素,提供额外功能

直接继承Component将不提供可视功能,继承Control和Behavior可提供可视功能。因为Control和Behavior类封装了DOM

全局容器:Sys._Application为一个全局容器类, 维护着全局的所有Component对象的生命周期。注意,所有的控件都必须在Load时才能使用Initialize和Dispose时不能时候。

下面有一个小例子,来示例如何简单开发一个继承于Component类的用户组件

首先一个继承与Component类的组件

// JScript 文件
Type.registerNamespace("Demo");
Demo.SimpleComponent 
= function()
{
    
//调用基类的构造函数
    Demo.SimpleComponent.initializeBase(this);
}


Demo.SimpleComponent.prototype 
= 
{
    
//重写initialize方法
    initialize : function()
    
{
        
//调用基类的initialize方法,注意这段代码放在我们代码之前
        Demo.SimpleComponent.callBaseMethod(this"initialize");
        alert(
"I have been initialized!");
    }
,
    
    
//重写dispose方法
    dispose : function()
    
{
        alert(
"I have start dispose right now");
        
//调用基类的dispose方法,注意这段代码放在我们的代码之后
        Demo.SimpleComponent.callBaseMethod(this"dispose");
    }
,
    
    
//组件的公开方法
    sayHi : function()
    
{
        alert(
"Hello, I am the first Component");
    }

}


//注册类,基类为Sys.Component类
Demo.SimpleComponent.registerClass("Demo.SimpleComponent", Sys.Component);

首先我们需要通过ScriptManager引入组件类的js文件

<asp:ScriptManager ID="ScriptManager1" runat="server">
    
<Scripts>
        
<asp:ScriptReference Path="~/SampleComponent.js" />
    
</Scripts>
</asp:ScriptManager>
下面是如何使用组件的代码
<script language="javascript" type="text/javascript">
    
function pageInit()
    
{
        alert(
"Page is initialized!");
        
//使用$create来创建一个组件,在pageInit方法中
        //就算调用$create创建组件之后,仍然不能使用这个组件
        $create(
                Demo.SimpleComponent,
                
//使用json字符串的方式给组件的属性赋值,
                //这里是给ID属性赋值,还可以扩展
                {"id" : "simpleComponent"},
                
//使用json字符串的方式给组件的事件添加事件处理器。
                {"disposing": onDisposing}
                );
    }

    
    
//页面默认的pageLoad事件处理器
    function pageLoad()
    
{
        
//通过Asp.Net Ajax提供的$find方法找到组件
        var simpleComponent = $find("simpleComponent");
        simpleComponent.sayHi();
    }

    
    
//组件的销毁中事件处理器
    function onDisposing()
    
{
        alert(
"Component is Disposing");
    }

    
    
//给Application全局对象添加init事件的事件处理器
    Sys.Application.add_init(pageInit);
</script>

这里要注意一下,在组件内部重写的dispose方法先被触发,表示开始销毁控件了,外部定义的onDisposing方法,表明控件已经正在销魂中了。在dispose方法中还是可以操纵组件的内部成员的,比如说清空指令,避免内存泄漏,但是在onDisposing方法中是不能在操作组件的内部成员了的,因为已经开始销毁组件了。

在这个例子中没有掩饰raisePropertyChange的相关例子,在下面说明一下

  1. 在改变属性时应该先判断一下外部传入的值是否和当前值不一样,如果不一样,在修改属性值之后可以调用raisePropertyChange方法,参数为当前的属性名,将PropertyChange事件抛出到页面,让页面能获取到哪个属性被修改了。
  2. PropertyChange的方法签名为sender和args,sender当然表明这个事件是哪个组件触发的。args中可以通过ge_propertyName得到我们在组件中调用raisePropertyChange方法的参数。如果我们要得到sender(也就是组件)改变的属性的改变后的值可以使用sender["get_" + propertyName].apply(sender)来得到。在这里sender是作为一个字典来使用,并且通过apply方法将sender作为函数的this指针传入到函数内部。
ajax技术,无刷新技术 导读:ScriptManager控件包括在ASP.NET 2.0 AJAX Extensions中,它用来处理页面上的所有组件以及页面局部更新,生成相关的客户端代理脚本以便能够在JavaScript中访问Web Service,所有需要支持ASP.NET AJAXASP.NET页面上有且只能有一个ScriptManager控件。在ScriptManager控件中我们可以指定需要的脚本库,或者指定通过JS来调用的Web Service,以及调用AuthenticationService和ProfileService,还有页面错误处理等。 ASP.NET AJAX入门系列(3):使用ScriptManagerProxy控件 导读:在ASP.NET AJAX中,由于一个ASPX页面上只能有一个ScriptManager控件,所以在有母版页的情况下,如果需要在Master-Page和Content-Page中需要引入不同的脚本时,这就需要在Content-page中使用ScriptManagerProxy,而不是ScriptManager,ScriptManager 和 ScriptManagerProxy 是两个非常相似的控件。 ASP.NET AJAX入门系列(4):使用UpdatePanel控件(一) 导读:UpdatePanel可以用来创建丰富的局部更新Web应用程序,它是ASP.NET 2.0 AJAX Extensions中很重要的一个控件,其强大之处在于不用编写任何客户端脚本,只要在一个页面上添加几个UpdatePanel控件和一个ScriptManager控件就可以自动实现局部更新。通过本文来学习一下UpdatePanel简单的使用方法(第一篇)。 ASP.NET AJAX入门系列(5):使用UpdatePanel控件(二) 导读:UpdatePanel可以用来创建丰富的局部更新Web应用程序,它是ASP.NET 2.0 AJAX Extensions中很重要的一个控件,其强大之处在于不用编写任何客户端脚本,只要在一个页面上添加几个UpdatePanel控件和一个ScriptManager控件就可以自动实现局部更新。通过本文来学习一下UpdatePanel其他的一些使用方法(第二篇)。 ASP.NET AJAX入门系列(6):UpdateProgress控件简单介绍 导读:在ASP.NET AJAX Beta2中,UpdateProgress控件已经从“增值”CTP中移到了ASP.NET AJAX核心中,本文简单介绍一些它的基本用法,翻译自官方文档。 ASP.NET AJAX入门系列(7):使用客户端脚本对UpdateProgress编程 导读:在本篇文章中,我们将通过编写JavaScript来使用客户端行为扩展UpdateProgress控件,客户端代码将使用ASP.NET AJAX Library中的PageRequestManager,在UpdateProgress控件中,将添加一个Button,来允许用户取消异步更新,并且使用客户端脚本来显示或者隐藏进度信息,翻译自官方文档。 ASP.NET AJAX入门系列(8):自定义异常处理 导读:在UpdatePanel控件异步更新时,如果有错误发生,默认情况下会弹出一个Alert对话框显示出错误信息,这对用户来说是不友好的,本文看一下如何在服务端和客户端脚本中自定义异常处理,翻译自官方文档。 ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel 导读:本文简单介绍一下在母版页中使用UpdatePanel控件,翻译自官方文档。 ASP.NET AJAX入门系列(10):Timer控件简单使用 导读:本文主要通过一个简单示例,让Web页面在一定的时间间隔内局部刷新,来学习一下ASP.NET AJAX中的服务端Timer控件的简单使用。 ASP.NET AJAX入门系列(11):在多个UpdatePanle中使用Timer控件 导读:本文将使用Timer控件更新两个UpdatePanel控件,Timer控件将放在UpdatePanel控件的外面,并将它配置为UpdatePanel的触发器,翻译自官方文档 作者:TerryLee 出处:http://terrylee.cnblogs.com
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值