Подтвердить что ты не робот

Сделать фокус получения элемента div

Как я могу создать фокус приема элемента <div> HTML, поэтому элементы будут вставляться в фокус, когда на них вызывается focus()?

4b9b3361

Ответ 1

Установите tabindex="0" в div, исходя из предположения, что вы хотите, чтобы div получал фокус, а не дочерние элементы.

Обновлен ответ, чтобы добавить демонстрационную версию JS Fiddle, в которой показано средство JavaScript для достижения этого:

var divs = document.getElementsByTagName('div');
for (var i = 0, len = divs.length; i < len; i++){
    divs[i].setAttribute('tabindex', '0');
}

JS Fiddle demo.

При составлении демонстрации я обнаружил, что tabindex="-1" позволяет элементу получать щелчки мыши для назначения фокуса, но не события клавиатуры (через кнопку tab), однако (и, как это подразумевается в комментарии, ранее, Fabricio Matté, a tabindex="0" позволяет обоим). Поэтому я использовал это в демо и обновил исходный ответ, чтобы отразить это изменение.

Ответ 2

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

Мое решение для достижения фокуса, основанного на кликах, состояло в том, чтобы добавить событие click на элементе с tabindex, а затем вручную вызвать фокус().

Вот код jQuery (протестирован в Chrome (версия 61)).

var elementToFocusOn = $('#elementId');

elementToFocusOn.click(function () {
    elementToFocusOn.focus();
});

elementToFocusOn.focus(function () {
    console.log('Focused');
});

elementToFocusOn.blur(function () {
    console.log('Blurred');
});