onfocus не вызывается при использовании атрибута автофокуса для тега ввода - PullRequest
6 голосов
/ 05 декабря 2010

В следующем примере я получаю только одно окно с предупреждением.Я прочитал, что основное внимание уделяется выполнению кода JavaScript.Есть ли способ заставить это работать?

<input id="i" type="text" autofocus onfocus="alert(1)">

<script type="text/javascript">
document.getElementById('i').addEventListener('focus', function() {
    alert(2);
}, false);
</script>

(я проверял это только в Safari)

Редактировать: Очевидно, я могу сделать это таким образом (селектор Prototypejs):

var autofocusElement = $$('input[autofocus]')[0];
callListener(autofocusElement);

Но это выглядит ужасно по сравнению только с добавлением прослушивателя событий.

Редактировать:

Не беспокойтесь из-за отсутствия поддержки браузером атрибута автофокуса.Это решается легко, как я сделал в я возиться ссылки ниже.Существует также лучшее решение проблемы, как я вижу.Мой вопрос заключается в том, могу ли я сделать это менее уродливо, чем вызывать слушателя вручную.

http://jsfiddle.net/tellnes/7TMBJ/3/

Он отлично работает в Firefox 3.6, поскольку Firefox не поддерживает автофокусировку.Но в Safari, который поддерживает автофокус, не вызывается событие.

Ответы [ 4 ]

5 голосов
/ 05 декабря 2010

Из HTML5 рабочего проекта :

Не должно быть больше одного элемент в документе с autofocus указан атрибут.

Итак, вы все равно просите о неопределенном поведении.

Только с одним элементом autofocus в Firefox 3.6 ни один из обработчиков не вызывается при загрузке страницы. Ручная передача фокуса элементу вызывает оба обработчика (затем переходит в бесконечный цикл из-за блоков предупреждений, возвращающих фокус элементу при закрытии).

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

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

0 голосов
/ 30 января 2018

Вам нужно указать значение автофокуса.
<input id="i" type="text" onfocus="alert(1)" autofocus="">

0 голосов
/ 05 декабря 2010

Следующий код из вашего текущего примера:

<input id="i" type="text" autofocus onfocus="alert(1)">

<script type="text/javascript">
    document.getElementById('i').addEventListener('focus', function() {
        alert(2);
    }, false);
</script>

собирается вызвать бесконечный цикл оповещений, идущий от 1 до 2

[Eidt]

потому что: (это происходит только в браузерах, поддерживающих autofocus)

вход получает автофокус, запускает событие, которое запускает предупреждение, предупреждение захватывает фокус, нажимает ОК, ввод захватывает фокус, событие фокусировки запускает новое событие, вызывающее теперь два разных предупреждения (DOM полностью загружен, поэтому новое событие добавляется с другим предупреждением), оба оповещения захватывают фокус, нажимают «ОК», нажимают «ОК», ввод захватывает фокус, запускает новое событие, теперь запускаются два разных оповещения, оповещение захватывает фокус, нажимает «ОК», следующее оповещение захватывает фокус, нажимает «ОК», ввод захватывает фокус, запускает оба события, оповещение захватывает фокус, нажмите «ОК», следующее предупреждение захватывает фокус, нажмите «ОК», ввод захватывает фокус, запускает оба события, предупреждение захватывает фокус, нажимает «ОК», следующее предупреждение захватывает фокус, нажимает «ОК», ввод захватывает фокус, запускает оба события, предупреждение захватывает фокус, нажимает «ОК», далее предупреждение захватывает фокус, нажимает ОК, ввод захватывает фокус, запускает оба события, ввод захватывает фокус, запускает оба события, предупреждение захватывает фокус, нажимает ОК, следующее предупреждение захватывает фокус, нажимает ОК, ввод захватывает фокус, запускает оба события, ввод захватывает фокус, запускает оба события, предупреждение захватывает фокус, нажимает ок, следующее предупреждение захватывает фокус, нажимает ок, в установить фокус, запустить оба события, захватить фокус ввода, активировать оба события, сфокусировать предупреждение, щелкнуть «ОК», следующее предупреждение захватить фокус, нажать «ОК», фокус ввода захватить, активировать оба события ...

Текстовое описание бесконечного процесса FTW! ....? : P

[/ править]

В ваших предыдущих примерах с применением двух автофокусов кажется, что последний будет выполнен, как в примере, который я прикрепил внизу. Я также добавил способ добавления события фокуса к каждому входу на основе имени класса ... Не уверен, что вы ищете это, но хотя это может помочь.

JSFiddle Пример события onfocus

0 голосов
/ 05 декабря 2010

Если вам нужно выполнить фрагмент кода JavaScript, onfocus для любого input, вы можете использовать jQuery: http://api.jquery.com/focus/

...