如题,就以chrome为代表举例说明遇到mousemove的问题。
为body
分别绑定onmousedown
、onmousemove
、onmouseup
,并为触发时打印至控制台。代码如下(同学不要忘记body
要全屏,并在body
上执行操作):
1 | var body = document.body; |
先将鼠标移至body区内,刷页面,单击一次body
,会发现依次打印了down
、up
、move
,由此可断定是于up
后执行的move
。我们知道一般我们执行一次点击过程的顺序为:onmousedown
、onmousemove
、onmouseup
、click
,而在chrome中却在onmouseup
后执行了一次onmousemove
,此bug说不清是否有意而为之,但对于开发来说是没有必要的,因此我们就要避免此问题的出现,以免莫名多执行了一次onmousemove
。
解决方法不高级,也就是判断是否真的移动了,从而判断是否执行onmousemove
触发的函数。
1 | var body = document.body, |
会发现,onmousemove
恢复正常。单击依次打印:down
、up
。
问题就此解决。