Как вы очищаете фокус в javascript?

159

Я знаю, что это не должно быть так сложно, но я не смог найти ответ в Google.

Я хочу выполнить фрагмент JavaScript, который очистит фокус от любого элемента, на котором он находится, не зная заранее, на каком элементе находится фокус. Он должен работать как в Firefox 2, так и в более современных браузерах.

Есть ли хороший способ сделать это?

Andres
источник
что означает четкий фокус? - это так же, как размытие?
plodder
3
Я хочу сделать так, чтобы ни один элемент в браузере не фокусировался.
Андрес

Ответы:

170

Ответ: document.activeElement

Чтобы делать то, что вы хотите, используйте document.activeElement.blur()

Если вам нужна поддержка Firefox 2, вы также можете использовать это:

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

if (document.addEventListener) 
    document.addEventListener("focus", onElementFocused, true);
JPS
источник
8
Если Firefox 2 с 0,66% доли браузера является нарушителем правил ... У меня есть исправление, которое есть в моем отредактированном ответе.
jps
21
В 2013 году доля браузеров в Firefox 2 существенно меньше 0,66%, и простой document.activeElement.blur()способ - добиться этого.
Чоуи
88

.focus()а потом .blur()еще что-то произвольное на твоей странице. Поскольку только один элемент может иметь фокус, он передается этому элементу, а затем удаляется.

Кевин Рид
источник
Есть ли способ сделать невидимый элемент, который имеет фокус?
Андрес
1
Я не эксперт по лучшему способу сделать это; но вы, безусловно, могли бы расположить его вне экрана или за пределами overflow: clipстилизованного элемента. Но вы можете просто использовать поле, которое уже существует на странице. Или создайте один только для этой цели и удалите его снова.
Кевин Рейд
Я думаю, что установка фокуса на элемент вне экрана заставит прокрутить этот элемент. Тем не менее, вы можете создать невидимый элемент для этой цели. При этом некоторые браузеры могут испытывать трудности с удалением каретки. Просто blur (), вероятно, будет работать лучше. Вы все еще можете получить ключи с помощью обработчика событий keyup (keydown).
Алексис Уилке
5
Этот ответ устарел и не применяется в 2017 году. Вместо этого используйте activeElement, как в stackoverflow.com/a/2520670/39808
Пол Фишер
Это все еще работает, только дольше и перемещает фокус (что может помешать навигации по TAB). Также не сразу видно, каким должно быть «что-то еще произвольное».
user202729
50
document.activeElement.blur();

Работает неправильно в IE9 - он стирает все окно браузера, если активный элемент является телом документа. Лучше проверить для этого случая:

if (document.activeElement != document.body) document.activeElement.blur();
pwnzor1337
источник
Это правда, но сегодня почти никто не использует IE9 больше.
Дональд Дак
18

Ни один из приведенных здесь ответов не является полностью правильным при использовании TypeScript, так как вы можете не знать, какой тип элемента выбран.

Поэтому это было бы предпочтительным:

if (document.activeElement instanceof HTMLElement)
    document.activeElement.blur();

Кроме того, я бы не рекомендовал использовать решение, представленное в принятом ответе, поскольку получающееся в результате размытие не является частью официальной спецификации и может прерваться в любой момент.

wilcobrouwer
источник
6
Приятно видеть, как вопрос, который я задал в 2010 году, продолжает иметь развивающийся ответ.
Андрес
2

dummyElem.focus () где dummyElem - скрытый объект (например, имеет отрицательный zIndex)?

флегматичный
источник
0

Вы можете вызвать window.focus ();

но перемещение или потеря фокуса обязательно мешает любому, кто использует клавишу табуляции для перемещения по странице.

Вы можете прослушать код 13 и отказаться от эффекта, если нажать клавишу табуляции.

Kennebec
источник
-3

С jQuery это просто: $(this).blur();

bsbak
источник
2
Это старый ответ, поэтому вы, возможно, уже знаете, но есть две причины, по которым этот ответ не применим. 1. Предполагается, что OP использовал jquery, 2. thisдолжен быть сфокусированным элементом, в то время как в вопросе явно говорится, что OP не знает сфокусированный элемент заранее.
Брэндон