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

时间:2022-02-15 05:31:43

Possible Duplicate:
How do I find out which DOM element has the focus?

可能的重复:如何查找哪个DOM元素具有焦点?

Is there a way in javascript to determine which html page element has focus?

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

5 个解决方案

#1


79  

Use the document.activeElement property.

使用文档。activeElement财产。

The document.activeElement property is supported on Chrome 2+, Firefox 3+, IE4+, Opera 9.6+ and Safari 4+.

该文档。activeElement属性支持Chrome 2+、Firefox 3+、IE4+、Opera 9.6+和Safari 4+。

Note that this property will only contain elements that accept keystrokes (such as form elements).

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

#2


45  

Check out this blog post. It gives a workaround so that document.activeElement works in all browsers.

看看这篇博文。它为文档提供了一个变通方法。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);
}

Something to note:

一些注意事项:

This implementation is slightly over-pessimistic; if the browser window loses focus, the activeElement is set to null (as the input control loses focus as well). If your application needs the activeElement value even when the browser window doesn't have the focus, you could remove the blur event listener.

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

#3


6  

Just for the record, a little late, and of course not supported in old browsers:

仅供参考,有点晚了,当然旧浏览器不支持:

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

Should work on all elements (e. g. also anchors).

应该对所有元素(例如,锚)进行处理。

#4


3  

Maybe document.activeElement, don't know about browser support tho. Seems to work in Firefox and IE7, but I guess you have to try it in Opera and so on too.

也许文档。activeElement,不知道浏览器支持tho。似乎在Firefox和IE7中工作,但我猜你必须在Opera上尝试一下,等等。

#5


0  

Check the bottom post. I think that would work...

检查文章底部。我想那行得通……

#1


79  

Use the document.activeElement property.

使用文档。activeElement财产。

The document.activeElement property is supported on Chrome 2+, Firefox 3+, IE4+, Opera 9.6+ and Safari 4+.

该文档。activeElement属性支持Chrome 2+、Firefox 3+、IE4+、Opera 9.6+和Safari 4+。

Note that this property will only contain elements that accept keystrokes (such as form elements).

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

#2


45  

Check out this blog post. It gives a workaround so that document.activeElement works in all browsers.

看看这篇博文。它为文档提供了一个变通方法。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);
}

Something to note:

一些注意事项:

This implementation is slightly over-pessimistic; if the browser window loses focus, the activeElement is set to null (as the input control loses focus as well). If your application needs the activeElement value even when the browser window doesn't have the focus, you could remove the blur event listener.

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

#3


6  

Just for the record, a little late, and of course not supported in old browsers:

仅供参考,有点晚了,当然旧浏览器不支持:

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

Should work on all elements (e. g. also anchors).

应该对所有元素(例如,锚)进行处理。

#4


3  

Maybe document.activeElement, don't know about browser support tho. Seems to work in Firefox and IE7, but I guess you have to try it in Opera and so on too.

也许文档。activeElement,不知道浏览器支持tho。似乎在Firefox和IE7中工作,但我猜你必须在Opera上尝试一下,等等。

#5


0  

Check the bottom post. I think that would work...

检查文章底部。我想那行得通……