Что означает «для» в теге ярлыка?

Question

Только что натолкнулся на параметр for в теге метки HTML:

<label for="required-firstname"> First Name </label>
<small>*</small>
<input name="required-firstname" type="text" tabindex="2" 
       id="required-firstname" size="24" maxlength="40">

Я конвертирую эту форму в обработанный PHP-скрипт, могу ли я избавиться от параметров for =? (И из любопытства, что это делает?)

Answer 1

От w3schools.org:

Тег определяет метку для элемента ввода.

Элемент label не отображается как нечто особенное для пользователя. Тем не менее, он обеспечивает улучшение удобства использования для пользователей мыши, потому что, если пользователь нажимает на текст в элементе метки, он переключает элемент управления.

Атрибут for тега должен быть равен атрибуту id связанного элемента, чтобы связать их вместе.

НТН!

добавив мои $ .02 в качестве Accessibility SME - так же как удобство использования, LABEL также связывает поле ввода с правильной меткой, чтобы люди, использующие программы чтения с экрана, знали, для чего это поле.

Answer 2

Тег метки HTML определяет метку для элемента формы. Они обычно используются с флажками и переключателями, и когда пользователь нажимает на ярлык, он переключает кнопку. С вводом текста (и вам нужно убедиться в этом), я думаю, он фокусируется на вводе только тогда, когда пользователь нажимает на ярлык.

Answer 3

Указывает, с каким элементом связана эта метка. В вашем примере кода есть метка для поля ввода required-firstname . Если пользователь нажимает на эту метку, фокус переходит к связанному полю ввода. Это улучшение юзабилити, и я думаю, вам лучше оставить все как есть. Это хорошая практика.

Answer 4

Атрибут «for» является необходимым элементом для доступности вашей формы. Не опускайте это. Для тех, кто использует программу чтения с экрана (SR), чтобы объявить им веб-страницу, атрибут «for» связывает элемент управления с меткой. Обычно пользователь SR будет перемещаться по форме от одного элемента управления (который является фокусируемым элементом для SR) к следующему. Без атрибута «for» пользователь SR должен будет изменить режимы на SR и исследовать форму, чтобы попытаться определить, какой элемент управления соответствует какой метке, что может занять много времени и привести к путанице. Атрибут «for» также может быть полезен для вспомогательных технологий, связанных с проблемами с двигателем.

На WebAIM.org есть отличная страница, объясняющая разветвления доступности для "for": http://webaim.org/techniques/forms/controls

Answer 5

Связывает метку с идентификатором элемента формы. Некоторые элементы формы, такие как флажки, можно активировать, щелкнув их метку.

Answer 6

В некоторых браузерах, когда вы нажимаете на текст в теге for, вы устанавливаете флажок, с которым он связан (то есть for = id), или устанавливаете фокус на этом поле. Это вещь ADA