当前位置:  开发笔记 > 编程语言 > 正文

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

如何解决《如何确定哪个html页面元素具有焦点?》经验,为你挑选了3个好方法。

使用该document.activeElement属性.

document.activeElementChrome 2 +,Firefox 3 +,IE4 +,Opera 9.6+和Safari 4+支持该属性.

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



1> Aron Rotteve..:

使用该document.activeElement属性.

document.activeElementChrome 2 +,Firefox 3 +,IE4 +,Opera 9.6+和Safari 4+支持该属性.

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


自Safari 4昨天发布以来.所有主流浏览器的最新版本现在都支持document.activeElement属性.你应该仍然使用旧版浏览器的事件 - 黑客(参见Paolo的回答):if(!document.activeElement){/*添加事件监听器为旧浏览器设置document.activeElement*/}

2> Paolo Bergan..:

看看这篇博文.它提供了一种解决方法,因此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值,即使浏览器窗口没有焦点,您也可以删除blur事件侦听器.



3> ernesto..:

只是为了记录,有点晚了,当然在旧浏览器中不支持:

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

应该适用于所有元素(例如锚点).

推荐阅读
虎仔球妈_459
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有