Javascript 检索以前关注的元素

我想在Javascript中找出前一个元素的焦点与当前的焦点相对。我一直在搜索DOM，但还没有找到我需要的东西。有没有办法做到这一点呢？任何帮助都将不胜感激。

根据您的页面正在做的其他事情，这可能会很棘手，但对于初学者来说，您可以在

元素上附加一个“模糊”事件处理程序，该处理程序只存储事件目标。

每次聚焦一个元素时，您都必须存储它是哪一个。然后，当另一个元素被聚焦时，您可以检索前一个聚焦元素的变量

因此，基本上，您的单个焦点处理程序将做两件事：

检查是否定义了previousFocus。如果是，则检索它

将previousFocus设置为当前聚焦的元素

下面是jQuery的一个快速演示（您也可以使用原始JS…使用jQuery的行数更少，因此更容易理解）：

---

刚刚在解决完全相同的问题时发现了这个问题，并意识到它太旧了，jQuery世界已经有点进步了：）

这将提供一个更有效的

Peter Ajtai

s代码版本，因为它将只使用一个委托事件处理程序（而不是每个输入元素一个）

JSFiddle:

注意事项：

• 使用$（）创建一个空的jQuery对象（允许立即使用它）
• 由于这个函数使用jQuery

  ：input

  选择器，因此它与

  选择

  和

  按钮

  元素以及输入一起工作
• 它不需要DOM就绪处理程序，因为

  文档始终存在

• 由于需要先前关注的控件，“elsehere”仅存储在

  窗口中供全局使用，因此它不需要IIFE函数包装器

---

对我来说，这似乎比Gone的答案稍有改进：

window.currFocus = document;
// Catch focusin 
$(window).on( 'focusin', function () {
  window.prevFocus = window.currFocus;
  console.log( '£ prevFocus set to:');
  console.log( window.currFocus );
  window.currFocus = document.activeElement;
});

---

。。。在这个问题上没有规定我们在这里只讨论

INPUT

s：它说的是“先前的元素”。上面的代码还包括记录诸如按钮或任何能够获得焦点的东西的焦点。

这里有一种稍微不同的方法，它可以同时监视

聚焦in

和

聚焦out

，在这种情况下，可以防止聚焦到一类输入：

<input type="text" name="xyz" value="abc" readonly class="nofocus">
<script>
$(function() {
        var leaving = $(document);
        $(document).on('focusout', function(e) {
                leaving = e.target;
        });
        $( '.nofocus' ).on('focusin', function(e) {
                leaving.focus();
        });
        $( '.nofocus' ).attr('tabIndex', -1);
});
</script>

$（函数（）{
var=美元（文件）；
$（文档）.on（'focusout'，函数（e）{
离开=目标；
});
$（'.nofocus'）。on（'focusin'，函数（e）{
离开；
});
$（'.nofocus'）.attr（'tabIndex'，-1）；
});

设置

tabIndex

可防止键盘用户“卡住”。

document.getElementById（'message-text-area'）。addEventListener（'focus'，
event=>console.log（'FOCUS！'）
);

focusin

在Firefox@Michel中不起作用：你有没有在jQuery中尝试过这一点（它通常会补偿坏掉的浏览器实现）？我刚刚用FireFox试用了我的JSFIDLE，效果很好。：）在FireFox和MicrosoftEdge中也非常有用。

window.currFocus = document;
// Catch focusin 
$(window).on( 'focusin', function () {
  window.prevFocus = window.currFocus;
  console.log( '£ prevFocus set to:');
  console.log( window.currFocus );
  window.currFocus = document.activeElement;
});

<input type="text" name="xyz" value="abc" readonly class="nofocus">
<script>
$(function() {
        var leaving = $(document);
        $(document).on('focusout', function(e) {
                leaving = e.target;
        });
        $( '.nofocus' ).on('focusin', function(e) {
                leaving.focus();
        });
        $( '.nofocus' ).attr('tabIndex', -1);
});
</script>