Цель поведения автофокуса на веб-странице состоит в том, чтобы уберечь пользователей от перемещения с клавиатуры, чтобы выполнить действие мыши для наиболее распространенной задачи на этой странице.
Итак, вам нужно задать вопрос: «Какова самая распространенная задача, выполняемая на этой странице?»
Затем спросите: «Каков первый элемент (поле) пользовательского интерфейса, к которому пользователь должен получить доступ или отредактировать для выполнения наиболее распространенных задач на этом экране?»
Ваш ответ должен определить, куда направляется ваша автофокусировка. Но будьте осторожны - пользователи ожидают, что автофокус перейдет в первое поле на странице. Поэтому размещайте его в другом месте, только если вы уверены, что это желательно для пользователей. А также в этом случае рассмотрите возможность перемещения этого поля в верхнюю часть страницы.
В вашем случае элемент name полностью помечается (выбирается), потому что так работает автофокус для полей, которые уже содержат данные. Это наиболее желательное поведение, поскольку оно позволяет пользователю заменять содержимое поля без дальнейшей работы с курсором и клавишами удаления, и, если они хотят только редактировать, они могут просто использовать клавиши Home / End и клавиши со стрелками, чтобы быстро переместите курсор туда, где им это нужно.
===== Редактировать / Дополнение =====
Я забыл добавить это в первоначальном ответе, но это настолько огромная моя любимая мозоль, что я должен упомянуть об этом здесь.
Пожалуйста, если вы делаете автофокус, убедитесь, что он не срабатывает, если пользователь уже печатает! Нет ничего более раздражающего, чем автоматическое перемещение курсора во время входа в систему.
Это случалось на Yahoo! Экран входа в систему Mail все время. Если страница загружалась медленно, форма входа отображалась за несколько секунд до того, как DOM был готов, а автофокус срабатывал только тогда, когда он был готов. Поэтому я щелкаю вручную, чтобы сфокусироваться в поле входа в систему, и уже буду на полпути через свой пароль, когда автофокусировка тихо переместит мой курсор обратно в поле входа в систему, и я посмотрю на экран, чтобы найти половину моего пароль открытым текстом в поле логина, разбитый против моего имени пользователя.
Исправление так просто; просто проверьте, не заполнено ли поле для входа, прежде чем фокусироваться там. В противном случае не делайте этого, потому что вы знаете, что пользователь уже что-то набрал, и удобство автофокуса может превратиться в разочарование. Вот пример кода, при условии, что вашему полю присвоено id="username":
function focusIfBlank(){
username = document.getElementById('username');
if(username.value == "") {
username.focus();
}
}
Также рассмотрите возможность вызова focusIfBlank () вместо встроенного DOM, потому что вы увеличите шансы на то, что он будет полезен для пользователя, поскольку он будет фокусироваться почти сразу после рендеринга.