jQuery中如何完美解决Chrome下的mousemove事件bug?
在Chrome下有一个关于mousemove的bug是:
1.在触发mouseup事件时,包括在触发click和contextmenu时,也会触发mousemove事件;
2.更诡异的是,当你连续的触发contextmenu事件时,mousedown事件会被mousemove代替,
目前我想到的一个解决方案,通过时间戳比较:
var body = document.querySelector("h1"); var timeStamp; body.addEventListener("mousedown", function (e) { console.log("mouse down"); }, false); body.addEventListener("mouseup", function (e) { console.log("mouse up"); timeStamp = e.timeStamp; }) body.addEventListener("mousemove", function (e) { if (!timeStamp || ( e.timeStamp - timeStamp > 10)) { console.log("mouse move"); } })
这样能避免在触发click事件,或者触发鼠标左键mouseup引起的mousemove,但是对于上面描述的contextmenu引起的mousemove还是不能很好解决
请问有什么完美的解决办法吗?还是只能尽可能避免这种情况
<input type="text" id="a1" /> $("#a1").mousemove(function(){ if ($(this).data("x") === event.pageX && $(this).data("y") === event.pageY) { return false; } $(this).data({"x":event.pageX, "y":event.pageY}); $(this).after("1"); })
用jq是为了在所有浏览器下用.data()。思路就是这么个思路,你自己去改吧。
还有,一个元素绑定mousemove之后就别再绑定别的事件。
最后:尽量别用mousemove,太费资源。
可以通过比较mousedown的位置来确认是否是move操作
document.onmousemove = function(e) { // 不是move操作 if (x === mouseDown.x && y === mouseDown.y) { return false; }}; document.onmousedown = function (e) { mouseDown = { x: e.clientX, y: e.clientY };};
以上是jQuery中如何完美解决Chrome下的mousemove事件bug?的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

Win11系统无法安装中文语言包的解决方法随着Windows11系统的推出,许多用户开始升级他们的操作系统以体验新的功能和界面。然而,一些用户在升级后发现他们无法安装中文语言包,这给他们的使用体验带来了困扰。在本文中,我们将探讨Win11系统无法安装中文语言包的原因,并提供一些解决方法,帮助用户解决这一问题。原因分析首先,让我们来分析一下Win11系统无法

你在Windows上运行的每个应用程序都有一个组件程序来更新它。因此,如果你使用的是谷歌Chrome或谷歌地球,它会运行一个GoogleUpdate.exe应用程序,检查是否有更新可用,然后根据设置进行更新。然而,如果您不再看到它,而是在Windows11/10的任务管理器中看到一个进程updater.exe,这是有原因的。什么是Updater.exe在Windows11/10中?谷歌已经为其所有应用程序推出了更新,如GoogleEarth、GoogleDrive、Chrome等。这次更新带来了

随着智能手机技术的不断发展,手机在我们日常生活中扮演着越来越重要的角色。而作为一款专注于游戏性能的旗舰手机,黑鲨手机备受玩家青睐。然而,有时候我们也会面临到黑鲨手机开不了机的情况,这时候我们就需要采取一些措施来解决这一问题。接下来,就让我们来分享五招教你解决黑鲨手机开不了机的问题:第一招:检查电池电量首先,确保你的黑鲨手机有足够的电量。可能是因为手机电量耗尽

大家都知道,如果电脑无法加载驱动程序,该设备可能就无法正常工作或与计算机进行正确的交互。那在电脑上弹出无法在此设备上加载驱动程序的提示框,我们要如何解决呢?下面小编就教大家两招轻松解决问题。 无法在此设备上加载驱动程序解决方法 1、开始菜单搜索“内核隔离”。 2、将内存完整性关闭,上方提示“内存完整性已关闭。你的设备可能易受攻击。”点击后方忽略即可,不会对使用有影响。 3.重启机器之后即可解决问题。

随着社交媒体的不断发展,小红书已经成为越来越多年轻人分享生活、发现美好事物的平台。许多用户在发布图片时遇到了自动保存的问题,这让他们感到十分困扰。那么,如何解决这个问题呢?一、小红书发布自动保存图片怎么解决?1.清除缓存首先,我们可以尝试清除小红书的缓存数据。步骤如下:(1)打开小红书,点击右下角的“我的”按钮;(2)在个人中心页面,找到“设置”并点击;(3)向下滚动,找到“清除缓存”选项,点击确认。清除缓存后,重新进入小红书,尝试发布图片看是否解决了自动保存的问题。2.更新小红书版本确保你的小

Chrome的插件扩展程序安装目录是什么?正常情况下,Chrome插件扩展程序的默认安装目录如下:1、windowsxp中chrome插件默认安装目录位置:C:\DocumentsandSettings\用户名\LocalSettings\ApplicationData\Google\Chrome\UserData\Default\Extensions2、windows7中chrome插件默认安装目录位置:C:\Users\用户名\AppData\Local\Google\Chrome\User

标题:分析Oracle错误3114:原因及解决方法在使用Oracle数据库时,常常会遇到各种错误代码,其中错误3114是比较常见的一个。该错误一般涉及到数据库链接的问题,可能导致访问数据库时出现异常情况。本文将对Oracle错误3114进行解读,探讨其引起的原因,并给出解决该错误的具体方法以及相关的代码示例。1.错误3114的定义Oracle错误3114通

WordPress是一款非常流行的开源内容管理系统,许多个人用户和企业选择使用WordPress来建立和管理自己的网站。然而,在安装WordPress的过程中,有时会遇到一些问题,例如数据库连接错误、文件权限问题等。本文将针对常见的WordPress安装问题进行解决指南,通过具体的代码示例帮助用户快速解决问题。问题一:数据库连接错误当在安装WordPress
