jquery - focusout 事件后,Mouseleave 事件在 Firefox 中无法持续触发

标签 jquery firefox mouseleave focusout

我正在运行以下代码:

<html>
<body>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $('html').on('mouseleave', function(e) {                                                    
            console.log('mouseleave');
        });   
        $('#text1').on('focusout', function () {
            alert("focusout");
            setTimeout(function(){$('#text1')[0].focus();},0);
        });
    });
    </script>
    <input type=text id="text1">
</body>
</html>

当我在文本输入上触发 focusout 事件之前将鼠标移动到浏览器工具栏/选项卡/链接/等区域时, mouseleave 事件会触发,我可以按刷新按钮或任何其他按钮/选项卡/等。

但是,在我触发 focusout 事件后,mouseleave 事件不再触发,并且 focusout 阻止我按下该区域中的任何按钮。

如果我将鼠标从浏览器的文档窗口移至另一个应用程序或背景,甚至移至 Firebug 窗口,则 mouseleave 事件会触发,但当我将鼠标移至浏览器工具栏/选项卡/链接/等时不会触发区域。

但是,如果我手动单击返回文本输入,则 mouseleave 会再次开始正常触发。

此行为不会发生在 IE、Chrome 或 Safari 中,只会发生在 Firefox 中(我使用的是 Firefox 21)。

非常感谢任何建议或解释!

达纳

最佳答案

经过进一步调查,这似乎是 Firefox 问题而不是 jQuery 问题,因为在这种情况下,mouseout 事件在 Firefox 中也无法正确触发。我最终通过使用 mousemove 并检查事件的目标和相关目标来解决所有这些问题。当这种情况发生时(警报弹出后),mousemove 事件目标为 null,并且相关目标仅在页面的菜单部分中未定义,因此通过检查我们知道我们位于该部分并且我们可以处理它适本地。

这是我们最终使用的代码:

    $(document).on('mousemove', function(e) {
        if (!e.target.tagName && !e.relatedTarget) {
             console.log('mouseleave');
        }
    });

关于jquery - focusout 事件后,Mouseleave 事件在 Firefox 中无法持续触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17322501/

相关文章:

JQuery点击类循环

Jquery mouseleave事件: how to know towards what element the mouse is going?

jquery - 按照 href 中的链接作为回调

javascript - 如何判断多个<select>中选择了哪些选项?

jquery - 如何获取模态弹出窗口的YES按钮上Y键的onkeydown事件

javascript - 在 Firefox 中隐藏 &lt;input type ="date"> 的日历弹出窗口

javascript - navigator.geolocation.getCurrentPosition 在 chrome 和 firefox 中总是失败

html - 粘性灵活的页脚和页眉 CSS 在 WebKit 中运行良好,但在 Gecko 中却不行

c# - Windows 窗体上的鼠标离开事件

c# - 显示/隐藏 PictureBox 内的按钮