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

Asked
Viewd58582

70

可能重复:
如何确定哪个DOM元素具有焦点?

javascript中是否有方法确定哪个html页面元素具有焦点?

5 个答案

87

使用 document.activeElement 属性。

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

请注意,此属性将仅包含接受击键的元素(例如表单元素)。

  • Since Safari 4 was released yesterday. The latest release of all major browsers now support the document.activeElement property. You should still use the event-hack for older browsers though (see Paolo’s answer): if(!document.activeElement) { /* add event-listeners to set document.activeElement for older browsers */ }

    gregersJune 09, 2009 15:24
0

检查底部帖子。我认为那行得通...

3

也许 document.activeElement ,但对浏览器支持一无所知。似乎可以在Firefox和IE7中使用,但是我想您也必须在Opera中尝试使用它。

48

查看此博客文章。它提供了一种解决方法,以便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值,则可以删除模糊事件侦听器。