webkit内核下的mouseup后mousemove自动触发问题及解决方法
如题,就以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自动触发问题及解决方法的更多相关文章
- jQuery EasyUI动态添加控件或者ajax加载页面后不能自动渲染问题的解决方法
博客分类: jquery-easyui jQueryAjax框架HTML 现象: AJAX返回的html无法做到自动渲染为EasyUI的样式.比如:class="easyui-layout ...
- macOS Catalina 10.15版本下anaconda安装后navigator无法正常打开的解决方法
我最近用闲置的money购置了一个ipad,想利用ipad作为mac的复屏,但是这需要将macos升级到catalina才能支持这个功能,但是catalina的更新会导致很多软件都发生无法启动或一些奇 ...
- [ci] 基于1 上文实现拉取代码后能自动触发sonar-runner实现代码扫描评测,job1完成
基于1 上文实现拉取代码后能自动触发sonar-runner实现代码扫描评测,job1完成 添加sonar插件 SonarQube Plugin 配置: 系统设置à告知jenkins,sona ...
- Android 打开方式选定后默认了改不回来?解决方法(三星s7为例)
Android 打开方式选定后默认了改不回来?解决方法(三星s7为例) 刚刚在测试东西,打开一个gif图,然后我故意选择用支付宝打开,然后...支付宝当然不支持,我觉得第二次打开它应该还会问我,没想到 ...
- python2在安装pywin32后出现ImportError: DLL load failed 解决方法
python2在安装pywin32后出现ImportError: DLL load failed 解决方法 在python2中有时候会出现: import win32api ImportError ...
- Mac下新安装的MySQL无法登陆root用户解决方法
一 设置MySQL命令行搜索路径 0.苹果->系统偏好设置->最下边点mysql 在弹出页面中 启动mysql服务 1.打开终端,输入: sudo vi ~/.bash_profile ...
- win7系统下重启之后打印机服务就会自动停止的解决方法
win7系统下重启之后打印机服务就会自动停止的解决方法: 第一步.进入Win7系统后,您需要启动win7系统的任务管理器窗口,然后切换到进程这一栏中,将spoolsv.exe运行进程结束掉.之后,您同 ...
- Win10电脑经常自动掉线、自动断网的解决方法
近期一客户称自己使用电脑上网的时候,过一段时间莫名其妙的出现自动掉线.自动断网的情况,那么遇到这个问题该怎么办?下面装机之家分享一下Win10电脑经常自动掉线.自动断网的解决方法,以Win7系统为例. ...
- 解决Jupyter notebook安装后不自动跳转网页的方法
在安装完Jupyter notebook后,有童鞋说出现了各种不友好的问题,鉴于此情况,个人先随手写出以下三种情况,并给出解决方法: 题外建议:请使用谷歌浏览器为默认浏览器 一.对于弹不出浏览器的解决 ...
随机推荐
- Thread thread2 = new Thread()
Thread thread2 = new Thread() { @Override public void run() { test.function(); } }; thread1.start(); ...
- Grant的时候报错的解决:Access denied for user 'root'@'localhost' (using password: YES)
mysql> grant all on *.* to 'root'@'192.168.1.1' identified by 'password'; ERROR 1045 (28000): Acc ...
- R0-R37它是Arm 寄存器,那是,CPU内部。和GPIO注册所有外设。换句话说,要是arm的cpu,它包含了其他芯片公司将有R0-R37,和GPIO寄存器只有一个特定的芯片。
R0-R37它是Arm 寄存器.那是,CPU内部.和GPIO注册所有外设. 换句话说,要是arm的cpu,它包含了其他芯片公司将有R0-R37,和GPIO有. 版权声明:本文博主原创文章.博客,未经同 ...
- Atitit。团队建设--管理最佳实践--如何留住关键人才,防止人才外流 ??
Atitit.团队建设--管理最佳实践--怎样留住核心人才,防止人才流失 ?? 1. 1.人才流失后果 1 1. 1.员工的离职带走商业技术秘密和客户等资源 1 2. 2.影响在职员工的情绪.极大挫伤 ...
- Linux
介绍了相关的文件夹
学习Linux,先了解Linux标准的文件夹结构是非常重要的,学习的一个很好的铺垫之后的行动.去罗列大而全的所有文件夹. 本文主要说明.笔者本人接触,须要了解的一些文件文件夹,当然本文也会不断的更新或 ...
- linux安装QQ
下载链接:WineQQ2013SP6-20140102-Longene 下面步骤一定要依照顺序来,我用的系统是 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQ ...
- MVC 分离Controllers-Views
将MVC中的Controllers.Model和View分别放到单独的项目中 Model: 新建-项目-Windows-类库 MVCTest.Model Controller:新建-项目-Window ...
- NSIS:使用FileFunc.nsh头文件判断文件版本
原文 NSIS:使用FileFunc.nsh头文件判断文件版本 这里,轻狂拿WMP10做一个例子.关于WMP10的原始安装文件,可以下载后通过/C /T:D:\Windows Media Player ...
- ImageView建立selector在录音中遇到的小问题及解决方案
随着两张照片做了一个selector,采用ImageView的src要么background采用selector当点击,总不会出现点击效果,这就是为什么?经过一番折腾,后来发现"揭秘&quo ...
- Java设计模式偷跑系列(十八)建模和责任链模式的实现
转载请注明出处:http://blog.csdn.net/lhy_ycu/article/details/40018231 责任链模式(ChainOfResponsibility): 有多个对象,每一 ...