使用EventListener为Element 捕获焦点可能存在的BUG

addEventListener和removeEventListener是W3C XHTML DOM标准方法
其效果和Element的onclick,onmousemove,onmousedown,onmouseup直接赋值的效果相同。
那么怎么把鼠标消息完全传递到某个Element里呢?即使鼠标移到Element的界外。
这一点很重要,假如要拖动一个Element,鼠标肯定会移动到element范围外
这时候Element收不到mousemove的消息,拖动过程就会停止。
所以我在前面的例子里把鼠标消息处理放到document里。这样就可以完全获得鼠标移动的消息。
但这样还是存在问题。或者说可能的BUG,其根本在于事件处理队列过程。
一个HTML包含很多元素而且元素中可以嵌套元素,但假如一个元素需要处理鼠标移动的消息,
而父节点也需要处理鼠标移动的消息,浏览器会怎么处理呢?
比如document 包含 body , 而body 包含 div ,div中又放了个span
ducment,body,div,span 都添加了mousemove 的消息处理事件
浏览器会首先处理叶子节点的mousemove消息,然后再把消息传递给父节点,让父节点处理消息。
等父节点处理完后会把鼠标消息再发给父节点的父节点处理。
在上面一个例子里,假如鼠标移动到span上,首先会触发span的mousemove
然后触发div的mousemove,再触发body的mousemove,最后触发document的mousemove.
所以通过在document添加mousemove消息,再把消息传递给被拖动的对象里,
这样的过程鼠标的capture 是不完全的。
进一步设想假如我们现在在拖动着某个id="div1"的Element,当鼠标移动到某个span上时
这个span触发mousemove事件,这个span在mousemove时,在span上又创建了一个可以拖动的div元素
原来被拖动的id=div1的Element 可能就会被丢弃。尽管这种事件发生的概率很少,但理论上存在可能性!
但有一个BUG非常明显,就是当你拖动这个DIV时,你不能阻止document 进行Select的操作。

在这方面,我觉得IE的setCapture方法实在是太好用了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值