我正在运行以下代码:
<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/