Делаем флажки и радио-ярлыки кликабельными

Question

Большое количество (осмелюсь сказать больше всего?) Сайтов не делают метки кликабельными для своих флажков и радиовходов. Кажется, это огромный выигрыш в юзабилити при очень небольших усилиях. Существуют ли какие-либо проблемы совместимости / функциональности / удобства использования с <label>, которые мешают разработчикам использовать этот тег?

Изменить: Даже StackOverflow кажется виновным в этом, например, при задании вопроса, Ежедневно уведомлять о любых новых ответах метка флажка не активируется.

Answer 1

Нет причин, кроме лени. <label> s необходимы для доступности, а также очень удобны для тех из нас, кто плохо прицеливается щелчками мыши:)

Answer 2

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

Answer 3

А вот демонстрация для тех, кто ищет, как это сделать.

Существует способ связать текст рядом с элементом формы с самим элементом, поэтому любой из них можно щелкнуть для активации элемента управления:

что бы вы хотели выпить?

<label for="ice1"><input type="checkbox" name="withice" id="ice1">ice</label> 
<label for="ice2"><input type="checkbox" name="withlid" id="ice2">plastic lid</label>
<label for="ice3"><input type="checkbox" name="withstraw" id="ice3">straw</label>

Answer 4

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

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

Но, как правило, да, я думаю, просто у программистов нет этого в голове.

В ASP.NET WebForms (или как там это называется) вам нужен атрибут AssociatedControlID для элемента <asp:Label>.

Answer 5

<label> - это чистый HTML-тег, JavaScript не требуется.Я предполагаю, что все (основные) браузеры поддерживают этот тег, поскольку его очень легко реализовать.

Многие разработчики не используют его, потому что:

• это требует больших усилий (добавив все теги везде)
• они не знают о его существовании
• они не думают, что это удобно?!

Но нет никаких причин неиспользуйте тег.Если вы не очень ограничены вашей пропускной способностью, может быть?