Список проверки с нативными флажками
Нативные checkbox подходят для учебного списка действий, которые пользователь отмечает независимо друг от друга.
Назначение
Нативные checkbox подходят для учебного списка действий, которые пользователь отмечает независимо друг от друга.
Как это работает
Каждый флажок имеет связанную подпись, а список объединяет пункты. Отметка меняет текущее состояние контрола, но не сохраняется на сервере сама по себе. Для прогресса нужно отдельное чтение checked.
Пример
<fieldset><legend>Самопроверка страницы</legend><ul><li><label><input type="checkbox" name="checks" value="title"> Проверен заголовок вкладки</label></li><li><label><input type="checkbox" name="checks" value="links"> Проверены ссылки</label></li><li><label><input type="checkbox" name="checks" value="keyboard"> Проверена клавиатура</label></li></ul></fieldset>Что должно получиться
Три независимых флажка доступны через подписи и клавиатуру. Пример не выполняет проверки автоматически и не передаёт выбранные значения.
Граница применения и частая ошибка
Не выдавайте текущие галочки за подтверждённую техническую проверку. Они отражают отметки пользователя, а не автоматическое исполнение тестов или экспертную оценку.
Самостоятельная проверка
Пройдите все пункты клавишами Tab и Space. Перезагрузите собственный пример и определите, нужно ли приложению отдельное сохранение, учитывая возможное восстановление формы браузером.
HTML и CSS можно изменить в песочнице ниже. Она изолирована: JavaScript, внешние ресурсы и отправка форм отключены. Для проверки сетевых запросов, отправки данных или функций браузера используйте отдельную локальную страницу.