如何使HTML元素的事件,使用我们封装类的成员函数作为处理函数

本文介绍了一种在JavaScript中实现事件委托的方法,通过Function.createDelegate函数完成事件处理函数的上下文切换,使得HTML元素的事件可以调用封装类的成员函数。
    在网页中的Javascript特效,一般是由好多函数组成.但这样的特效,在使用中,会有诸多不便.但如果封装,一般会卡在"如何使HTML元素的事件,使用我们封装类的成员函数作为处理函数"
    那么,如何解决这个问题呢?
    只要切换事件全局上下文为我们类实例的上下文就可以了.
    如何实现切换呢?
    可以用javascript的委托,感觉原理就像把成员函数的二次寻址,转化成用一个自定义函数来实现寻址和参数传递.
    代码实现如下:
None.gif    // ajax .net 一段代码
None.gif
    Function.createDelegate = function(instance, method)
ExpandedBlockStart.gifContractedBlock.gif    
dot.gif{
InBlock.gif        
return function()
ExpandedSubBlockStart.gifContractedSubBlock.gif        
dot.gif{
InBlock.gif            method.apply(instance, arguments);
ExpandedSubBlockEnd.gif        }

ExpandedBlockEnd.gif    }

None.gif
    有了上面的生成委托代码的函数,我们可以这样来设置事件
None.gif    function AdShower(uiImg)
ExpandedBlockStart.gifContractedBlock.gif    
dot.gif{
InBlock.gif        
this.uiImg = uiImg;
ExpandedBlockEnd.gif    }

None.gif    
None.gif    AdShower.prototype.init 
= function()
ExpandedBlockStart.gifContractedBlock.gif    
dot.gif{
InBlock.gif        this.uiImg.onmousemove = Function.createDelegate(this,this.onmousemove);
ExpandedBlockEnd.gif    }
None.gif    
None.gif    AdShower.prototype.onmousemove 
= function()
ExpandedBlockStart.gifContractedBlock.gif    
dot.gif{
InBlock.gif        alert(
this.uiImg.outerHTML);
ExpandedBlockEnd.gif    }

None.gif

 这时,通过createDelegate,我们成功的完成了切换
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值