技术开发 频道

开发ASP.NET AJAX客户端定制行为

 
   接下来,我们将详细讨论前面涉及的两个事件处理器,下面先列出它们的相关代码。
    清单3—_onhover处理器和_onunhover处理器代码
function ZXZSamples$MyHoverBehavior$_onhover(){ 
this._hoverCount++;
var handler = this.get_events().getHandler("hover");
if (handler) {
handler(this, Sys.EventArgs.Empty);
}
}
function ZXZSamples$MyHoverBehavior$_onunhover(){
this._hoverCount--;
if (this._hoverCount ==0){
var handler = this.get_events().getHandler("unhover");
if (handler) {
handler(this, Sys.EventArgs.Empty);
}
}
}
    在第一个事件处理器函数中,我们首先在悬浮次数计数器变量_hoverCount上加1。然后,我们通过由父类Component所维持的Sys.EventHandlerList实例中取得与事件'unhover'相关联的特定的事件处理器。最后,我们激活此特定事件。注意,这里的事件处理器变量本质上是一个函数,当调用之时,它能够执行与特定事件'unhover'相关联的所有事件处理器。
相反的是,在第二个事件处理器函数中,操作几乎同第一个函数中逻辑相反。注意,只有当悬浮次数计数器变量值为0时,我们才激活特定的事件"unhover"。

    (三) Descriptor块定义
    定制行为的Descriptor块定义如下所示。

     清单4—descriptor块定义代码
ZXZSamples.MyHoverBehavior.descriptor ={ 
properties: [
{ name: 'hoverElement', type: Object,isDomElement:true,readOnly:true},
{ name: 'unhoverDelay', type: Number}
],
events: [
{name: 'hover'} ,
{name: 'unhover'}
]
}
    注意,MS AJAX XML-script引擎需要一个descriptor类型把标记代码分析成一个客户端组件的实例。因此,仅有那些提供了descriptor类型的客户端组件都可用于XML-script编码中。在本文中的行为MyHoverBehavior中,我们暴露了两个属性—hoverElement和unhoverDelay,还有两个事件—hover和unhover。

(四) 使用定制行为MyHoverBehavior

    请注意,为了以声明方式使用前面创建的定制行为,我们最好使用“ASP.NET CTP-enabled Website”模板来创建示例网站(并命名为MyHoverBehavior)。为了简化起见,在此,我们仅仅列出最重要的xml-script代码段:

    清单5—定制行为类MyHoverBehavior应用于声明性xml-script代码段内。
<script type="text/xml-script">
<page xmlns:script="http://schemas.microsoft.com/xml-script/2005" xmlns:cc="javascript:ZXZSamples">
<components>
<control id="panel1">
<behaviors>
<cc:MyHoverBehavior unhoverDelay="300" >
<hover>
<setPropertyAction target="panel1" property="element" propertyKey="className" value="hover"/>
</hover>
<unhover>
<setPropertyAction target="panel1" property="element" propertyKey="className" value="start"/>
</unhover>
</cc:MyHoverBehavior>
</behaviors>
</control>
<application>
<load>
<setPropertyAction target="panel1" property="element" propertyKey="className" value="start"/>
</load>
</application>
</components>
</page>
</script>

0
相关文章