如题,就以chrome为代表举例说明遇到mousemove的问题。

为body分别绑定onmousedown、onmousemove、onmouseup,并为触发时打印至控制台。代码如下(同学不要忘记body要全屏,并在body上执行操作):

 var body = document.body;

 body.onmousedown = function() {
console.log('down');
} body.onmousemove = function(e) {
console.log('move');
} body.onmouseup = function() {
console.log('up');
}

先将鼠标移至body区内,刷页面,单击一次body,会发现依次打印了down、up、move,由此可断定是于up后执行的move。我们知道一般我们执行一次点击过程的顺序为:onmousedown、onmousemove、onmouseup、click,而在chrome中却在onmouseup后执行了一次onmousemove,此bug说不清是否有意而为之,但对于开发来说是没有必要的,因此我们就要避免此问题的出现,以免莫名多执行了一次onmousemove。

解决方法不高级,也就是判断是否真的移动了,从而判断是否执行onmousemove触发的函数。

 var body = document.body,
obj = {}; body.onmousedown = function(e) {
console.log('down');
} body.onmousemove = function(e) {
if (e.pageX === obj.x && e.pageY === obj.y) {
return false;
}
console.log('move');
} // 前面说过是在onmouseup后执行onmousemove,因此在这更改x,y更合理
body.onmouseup = function(e) {
obj.x = e.pageX;
obj.y = e.pageY;
console.log('up');
}

会发现,onmousemove恢复正常。单击依次打印:down、up。

问题就此解决。

webkit内核下的mouseup后mousemove自动触发问题及解决方法的更多相关文章

  1. jQuery EasyUI动态添加控件或者ajax加载页面后不能自动渲染问题的解决方法

    博客分类: jquery-easyui jQueryAjax框架HTML  现象: AJAX返回的html无法做到自动渲染为EasyUI的样式.比如:class="easyui-layout ...

  2. macOS Catalina 10.15版本下anaconda安装后navigator无法正常打开的解决方法

    我最近用闲置的money购置了一个ipad,想利用ipad作为mac的复屏,但是这需要将macos升级到catalina才能支持这个功能,但是catalina的更新会导致很多软件都发生无法启动或一些奇 ...

  3. [ci] 基于1 上文实现拉取代码后能自动触发sonar-runner实现代码扫描评测,job1完成

    基于1 上文实现拉取代码后能自动触发sonar-runner实现代码扫描评测,job1完成   添加sonar插件 SonarQube Plugin   配置: 系统设置à告知jenkins,sona ...

  4. Android 打开方式选定后默认了改不回来?解决方法(三星s7为例)

    Android 打开方式选定后默认了改不回来?解决方法(三星s7为例) 刚刚在测试东西,打开一个gif图,然后我故意选择用支付宝打开,然后...支付宝当然不支持,我觉得第二次打开它应该还会问我,没想到 ...

  5. python2在安装pywin32后出现ImportError: DLL load failed 解决方法

    python2在安装pywin32后出现ImportError: DLL load failed 解决方法 在python2中有时候会出现: import win32api   ImportError ...

  6. Mac下新安装的MySQL无法登陆root用户解决方法

      一 设置MySQL命令行搜索路径 0.苹果->系统偏好设置->最下边点mysql 在弹出页面中 启动mysql服务 1.打开终端,输入: sudo vi ~/.bash_profile ...

  7. win7系统下重启之后打印机服务就会自动停止的解决方法

    win7系统下重启之后打印机服务就会自动停止的解决方法: 第一步.进入Win7系统后,您需要启动win7系统的任务管理器窗口,然后切换到进程这一栏中,将spoolsv.exe运行进程结束掉.之后,您同 ...

  8. Win10电脑经常自动掉线、自动断网的解决方法

    近期一客户称自己使用电脑上网的时候,过一段时间莫名其妙的出现自动掉线.自动断网的情况,那么遇到这个问题该怎么办?下面装机之家分享一下Win10电脑经常自动掉线.自动断网的解决方法,以Win7系统为例. ...

  9. 解决Jupyter notebook安装后不自动跳转网页的方法

    在安装完Jupyter notebook后,有童鞋说出现了各种不友好的问题,鉴于此情况,个人先随手写出以下三种情况,并给出解决方法: 题外建议:请使用谷歌浏览器为默认浏览器 一.对于弹不出浏览器的解决 ...

随机推荐

  1. 第一pga 畸形消费分析

     第一pga 畸形消费分析 os: aix 6 db:10205 ------使用os 命令观察oracle 存消耗情况 #ps gv ......                         ...

  2. php学习之路:WSDL详细解释(两)

    3.定义服务使用的逻辑消息 当服务的操作被调用时.服务被定义为消息交换.在wsdl文档中,这些消息被定义message元素. 这些消息由称之为part元素的部分组成. 一个服务的操作,通过指定逻辑消息 ...

  3. Codefoces 432 C. Prime Swaps

    哥德巴赫猜想: 任一大于2的偶数,都可表示成两个素数之和. 任一大于5的整数都可写成三个质数之和. 贪心取尽可能大的素数..... C. Prime Swaps time limit per test ...

  4. backup mysql for xtrabackup with xbstream and lz4

    极品暂时mysql加入一个实例,采用xtrabackup最简单的速度. 在现有数据节点上: /home/work/app/xtrabackup-2.2.3/innobackupex --ibbacku ...

  5. HDU 3081 Marriage Match II(二分法+最大流量)

    HDU 3081 Marriage Match II pid=3081" target="_blank" style="">题目链接 题意:n个 ...

  6. Down to the TLP: How PCI express devices talk (Part I)

    http://xillybus.com/tutorials/pci-express-tlp-pcie-primer-tutorial-guide-1 Down to the TLP: How PCI ...

  7. PHP于Post和Get得到的数据写入到文件中

    有时Post要么Get越过那我们不知道什么样的形状数据,它可以是JSON格风格或只是简单地通过数据.这一次,我们能够把他写的文字,传过来的数据是什么格式了. $val = ""; ...

  8. Https 客户端与服务器交互过程梳理(转)

    本文试图以通俗易通的方式介绍Https的工作原理,不纠结具体的术语,不考证严格的流程.我相信弄懂了原理之后,到了具体操作和实现的时候,方向就不会错,然后条条大路通罗马.阅读文本需要提前大致了解对称加密 ...

  9. PowerDesigner教程

    PowerDesigner是一款功能很强大的建模工具软件,足以与Rose比肩,相同是当今最著名的建模软件之中的一个.Rose是专攻UML对象模型的建模工具,之后才向数据库建模发展,而PowerDesi ...

  10. django 简易博客开发 1 安装、创建、配置、admin使用(转)

    Django 自称是“最适合开发有限期的完美WEB框架”.本文参考<Django web开发指南>,快速搭建一个blog 出来,在中间涉及诸多知识点,这里不会详细说明,如果你是第一次接触D ...