获取焦点变化的焦点元素答案

【问题标题】：Get the focussed element on focus change获取焦点变化的焦点元素
【发布时间】：2020-02-18 22:15:34
【问题描述】：

我正在尝试记录最后一个具有焦点的文本输入元素。我的代码：

document.addEventListener('focus', function(e) {
    var obj = document.activeElement;
    if(obj instanceof HTMLInputElement && obj.type == 'text'){
        console.log('true');
    }
}, false);

当然，我做了console.log(obj);，它在 body 元素上触发良好，但在其他地方没有。除此之外，它似乎只触发一次。我不确定我做错了什么，或者这是否是正确的方法。所以我希望你们能帮助我。

注意：我知道我可以通过点击事件轻松解决问题，但是任何使用 Tab 浏览表单元素的人都会遇到问题。所以这不是一个解决方案。

【问题讨论】：

标签： javascript focus

【解决方案1】：

你可以绑定window并允许冒泡，你会得到带有target的元素。

window.addEventListener('focus', function(e) {
    if (e.target.id) console.log(e.target.id)
}, true);

<input type="text" id="tb1">
<input type="button" id="btn1" value="button">
<a href="#foo" id="link1">test</a>

【讨论】：

啊当然！事件冒泡确实是问题所在。非常感谢！