jQuery Focus 在 Firefox 上失败答案

【问题标题】：jQuery Focus fails on firefoxjQuery Focus 在 Firefox 上失败
【发布时间】：2011-10-26 04:24:38
【问题描述】：

我一直在对此other question 进行一些测试研究，当时我发现了一些非常奇怪的东西。 FF4/5 无法触发 focus jQuery 事件。 The other question 可能被认为是重复的，在没有真正答案的情况下被关闭并接受。

对于问题本身，我尝试了以下简单的代码：

$('#target').focusout(function() {
    $(this).focus();
});

它在 Chrome 和 IE 中运行良好，但在 FF 上失败。这是 jsFiddle 给我们中间那些懒惰的人的。

谁能解释这种行为？或者它是一个已知的错误？

【问题讨论】：

【解决方案1】：

我想我以前遇到过这个问题，如果我没记错的话，这似乎是某种重入问题。我的印象是，因为FF已经在转移焦点的过程中，它不会让你启动另一个焦点转移。我相信我的解决方法类似于

$('#target').focusout(function() {
    setTimeout(function() {
        $(this).focus();
    }, 0);
});

【讨论】：

这是我提供的解决方法，效果很好。
+1 因为focus() 在 Firefox 中确实有效。只有当包含在这个focusout() 中时，才会导致问题。
其实 setTimeout(func, 0) 应该足够了，因为函数从执行线程的上下文中取出并立即执行。 100ms 可能会导致一些闪烁 :)
确认超时 0 将起作用。此外，它不仅仅是 focusout()，而是任何涉及焦点更改的操作，在我的例子中只是一个简单的 .click() 处理程序。
我刚刚发现您可能需要等到页面准备就绪。我试图将焦点设置为 AJAX 加载的内容，并能够使用以下代码获得结果：jQuery(document).ready(function() { setTimeout(function() { jQuery('input[name =你的名字]').focus(); }, 1500); });

【解决方案2】：

manual 表示取消 .focus() 通话

这个方法是.trigger('focus')的快捷方式

来自.trigger() 主题

虽然 .trigger() 模拟事件激活，并带有合成的事件对象，但它并不能完美地复制自然发生的事件。

据我了解，调用 $(this).focus(); 应该会触发 OnFocus 事件（如果有一个附加到对象），但不能保证实际设置/更改焦点对象。

【讨论】：

【解决方案3】：

这在 Firefox 38 中对我有用。我需要测试不同的延迟毫秒。感谢@camaleo 的评论。

$(document).ready(function() {
setTimeout(function() { $('#myid').focus(); }, 100);
});

【讨论】：

【解决方案4】：

焦点现在在最新的 Firefox 中似乎可以工作，不需要 setTimeout 函数。

如果您还想选择输入字段，您将不得不使用 .select() 函数，尽管是 document.execCommand('SelectAll');似乎也不适用于 Firefox。

因此，首先将输入字段聚焦然后选择，然后您可以复制它或对它做任何您想做的事情。

在我的用例中，如果有人按下复制按钮，我需要从输入字段复制 url：

$(".copyURL").click(function(){ 
    $(this).prev().focus().select();
    document.execCommand("Copy",false,null);
});

我希望这可以帮助其他正在寻找这个问题的人！

【讨论】：

我刚刚下载了最新的firefox (v50.1)，发现并没有解决问题。也许linux版本没有修复错误？同时，非常感谢 @chaos 的 focusout 和 setTimeout（使用 0 毫秒）技巧。这确实解决了问题。