Сам по себе document.activeElementможет возвращать элемент, если документ не сфокусирован (и, следовательно, ничто в документе не сфокусировано!)
Вы можете хотеть такого поведения, или оно может не иметь значения (например, в рамках keydownсобытия), но если вам нужно знать, что что-то действительно сфокусировано, вы можете дополнительно проверить document.hasFocus().
Следующее даст вам сфокусированный элемент, если он есть, или еще null.
var focused_element = null;
if (
document.hasFocus() &&
document.activeElement !== document.body &&
document.activeElement !== document.documentElement
) {
focused_element = document.activeElement;
}
Чтобы проверить, имеет ли конкретный элемент фокус, проще:
var input_focused = document.activeElement === input && document.hasFocus();
Чтобы проверить, сфокусировано ли что-нибудь , еще раз сложнее:
var anything_is_focused = (
document.hasFocus() &&
document.activeElement !== null &&
document.activeElement !== document.body &&
document.activeElement !== document.documentElement
);
Примечание о надежности : в коде, в котором выполняется проверка, document.bodyи document.documentElementэто происходит потому, что некоторые браузеры возвращают один из них или nullкогда ничего не сфокусировано.
Он не учитывает, имел ли <body>(или может быть <html>) tabIndexатрибут и, таким образом, мог бы быть сфокусирован . Если вы пишете библиотеку или что-то еще и хотите, чтобы она была надежной, вам, вероятно, следует как-то с этим справиться.
Вот ( тяжелые воздушные кавычки) «однострочная» версия получения сфокусированного элемента, концептуально более сложная, потому что вы должны знать о коротком замыкании, и вы знаете, что он явно не помещается в одну строку, если вы хочу, чтобы это было читабельно.
Я не буду рекомендовать это. Но если вы 1337 hax0r, idk ... это там.
Вы также можете удалить || nullчасть, если вы не против получить falseв некоторых случаях. (Вы все еще можете получить, nullесли document.activeElementесть null):
var focused_element = (
document.hasFocus() &&
document.activeElement !== document.body &&
document.activeElement !== document.documentElement &&
document.activeElement
) || null;
Для проверки того, что конкретный элемент сфокусирован, вы также можете использовать события, но этот способ требует настройки (и, возможно, демонтажа), и, что важно, предполагает исходное состояние :
var input_focused = false;
input.addEventListener("focus", function() {
input_focused = true;
});
input.addEventListener("blur", function() {
input_focused = false;
});
Вы могли бы исправить предположение о начальном состоянии, используя нечетный способ, но тогда вы могли бы просто использовать его вместо этого.