有没有办法在初始悬停触发点击后"重置"移动Webkit的伪悬停行为?

Chr*_*son 5 javascript touchscreen mobile-safari javascript-events

我正在一个网站上,我正在使用Javascript(通过JQuery)添加包含列表中项目的额外信息的弹出框.我正在使用JQuery mouseenetermouseleave事件来使弹出窗口显示和消失,这当然在桌面浏览器中都可以正常工作.

在Mobile Safari中,当我点击一个项目时出现弹出窗口(这是我期望的和我想要发生的事情),并且我添加了一个ontouchstart触发mouseleaveJQuery事件的内容,从而在用户执行任何其他操作时隐藏任何可见的弹出窗口.除了当用户点击他们刚看过并取消的弹出窗口(通过滚动或通过执行任何其他触发ontouchstart事件的事件)而不是再次显示弹出窗口时,这也可以正常工作它会激活附加到该项目的链接.

如果用户点击另一个项目而不是再次点击相同的项目,那么该新项目的弹出窗口将显示,然后如果他们再次点击第一个项目,则该项目的弹出窗口将显示.同样,这既是预期的,也是我想要发生的事情.

似乎一旦有一个悬停事件的项目被点击并且Mobile Safari被迫发生该事件,那么该项目将被标记为已触发其悬停事件,因此下一个点击不必假装是一个悬停,它可以是正常的点击.使用悬停事件点击另一个项目似乎"重置"为前一个项目设置的标志.

我希望能够为自己'重置'这个标志,以便当前点击项目显示弹出窗口以及下一次点击该项目时,即使弹出窗口已关闭, ,当我用我的关闭弹出窗口时,会激活链接,ontouchstart因此我认为该项目不再"悬停",再次点击同一项目应再次显示弹出窗口然后仅显示点击该项目,同时弹出窗口可见链接激活.

当我使用ontouchstart触发器时,秘密似乎是让Mobile Safari退出其"伪悬停"模式,mouseleave但是当Mobile Safari假装悬停在任何东西上时,我无法在任何地方找到任何有用的信息.这可以通过Javascript事件访问.

我知道我可以编写一个弹出代码版本专门用于Mobile Safari,但是让浏览器完成模仿悬停事件的大部分工作似乎更有效率.如果只有我可以得到这个最后的小niggle整理出来.

Jed*_*iah 0

我猜测悬停状态与具有焦点的元素相关,而不是作为标志。轻轻一按即可获得焦点,第二次轻按可激活链接。

尝试通过给予另一个元素焦点来关闭弹出窗口,看看效果是否更好。

$('body').focus();
Run Code Online (Sandbox Code Playgroud)