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后,有童鞋说出现了各种不友好的问题,鉴于此情况,个人先随手写出以下三种情况,并给出解决方法: 题外建议:请使用谷歌浏览器为默认浏览器 一.对于弹不出浏览器的解决 ...
随机推荐
- 非阻塞IOserver型号
让我们来考虑一个场景,你和百万玩家的魔兽世界的忠实粉丝.时间之旅打每到周末boss. 每当周末比赛server在亚历山大,因为至少在同一时间数十万用户在线. 假设我们的多-threaded果酱serv ...
- FTP定时批量下载文件(SHELL脚本及使用方法 ) (转)--good
#/bin/bash URL="http://192.168.5.100/xxx.php" check() { RESULT=$(curl -s $URL) echo $RESUL ...
- Java里泛型有什么作用
1 泛型赋予了类型參数式多态的能力 2 泛型的第一个优点是编译时的严格类型检查,提高了程序的安全性和健壮性,这是集合框架最重要的特点. 3 泛型消除了绝大多数的类型转换.假设没有泛型,当你使用集合框架 ...
- eclipse 中 Android sdk 无法更新的问题
诶,真是麻烦,想下个东西都下不了. 我也好久没折腾过这个了,在家的电脑是早就下载好了的,然后如今又须要下载一份.下不到.网上搜到了资料,记录下来: 第一种方法: sdk manager - ...
- 使用exchange普通表模式被切换到分区表
随着数据库的不断增长的数据量.有些表需要转换的普通堆表分区表模式. 有几种不同的方式来执行此操作,如出口数据表,区表再导入数据到分区表:使用EXCHANGE PARTITION方式来转换为分区表以及使 ...
- 持续集成并不能消除 Bug,而是让它们非常容易发现和改正(转)
互联网软件的开发和发布,已经形成了一套标准流程,最重要的组成部分就是持续集成(Continuous integration,简称 CI). 本文简要介绍持续集成的概念和做法. 一.概念 持续集成指的是 ...
- 图片 Base64码 转换
import sun.misc.BASE64Decoder; private String getBase64Picture(String imgBase64Str) { FileOutputStre ...
- 在MVC5中的使用Ninject
在MVC5中的使用 Ninject 从MVC3中就开始接触Ninject这个IOC工具.也一直是MVC Framework系列书籍中推荐的IOC工具,当然还有优秀的Autofac等.性能和使用上面个有 ...
- java json字符串转List、Map等对象
List<Map<String, Object>> map = g.fromJson(jsonStr, new TypeToken<List<Map<Stri ...
- Canvas旋转图片--保持相同大小的算法
function drawImg(angle) { canvas.width = canvas.width; var distance = size / 2 * Math.sqrt(2) ...