如何确定哪个 html 页面元素有焦点？

可能的复制品:
如何找出哪个 DOM 元素具有焦点

在 javascript 中有没有一种方法来确定哪个 html 页面元素具有焦点？

61935 次浏览
小开

检查一下 底柱我觉得可以..。

小开

也许是 document.activeElement，不知道浏览器的支持。似乎可以在 Firefox 和 IE7中使用，但是我想你也可以在 Opera 等浏览器中尝试一下。

小开

看看 这篇博文，它提供了一个解决方案，使 document.activeElement可以在所有浏览器中工作。

function _dom_trackActiveElement(evt) {
if (evt && evt.target) {
document.activeElement = evt.target == document ? null : evt.target;
}
}


function _dom_trackActiveElementLost(evt) {
document.activeElement = null;
}


if (!document.activeElement) {
document.addEventListener("focus",_dom_trackActiveElement,true);
document.addEventListener("blur",_dom_trackActiveElementLost,true);
}

值得注意的是:

这个实现有点过于悲观; 如果浏览器窗口失去焦点，则 activeElement 被设置为 null (因为输入控件也失去焦点)。如果应用程序需要 activeElement 值，即使浏览器窗口没有焦点，也可以删除模糊事件侦听器。

小开
最佳答案

使用 document.activeElement属性。

Chrome 2 + 、 Firefox 3 + 、 IE4 + 、 Opera 9.6 + 和 Safari 4 + 都支持 document.activeElement属性。

注意，此属性将只包含接受击键的元素(如表单元素)。

小开

顺便说一句，有点晚了，当然还有 旧浏览器不支持:

var element = document.querySelector(":focus");

应工作在所有元素(如也锚)。


提交答案