Зміст курсу
Ultimate HTML
Ultimate HTML
Покращення Форм за Допомогою Атрибутів Введення
Елемент HTML <input>
дозволяє створювати різноманітні елементи форми для збору даних користувача. Ви можете налаштовувати поведінку та вигляд цих елементів за допомогою різних атрибутів. Розглянемо деякі з найбільш поширених атрибутів:
value
Атрибут value
використовується для встановлення початкового значення елемента <input>
. Конкретне значення залежить від типу поля введення:
Для кнопок (
type="button"
,type="reset"
,type="submit"
) визначає текст, що відображається на кнопці;Для текстових (
type="text"
) і парольних (type="password"
) полів визначає значення за замовчуванням;Для прапорців (
type="checkbox"
) і перемикачів (type="radio"
) визначає значення, пов'язане з елементом введення.
Note
Атрибут
value
не можна використовувати з<input type="file">
.
index.html
autofocus
Атрибут autofocus
вказує, що поле введення автоматично отримує фокус при завантаженні веб-сторінки. Після завантаження сторінки поле введення буде вибрано автоматично, дозволяючи користувачу одразу почати вводити дані без попереднього кліку по полю.
Примітка
Атрибут autofocus не працює тут, оскільки сторінка не перезавантажується при натисканні кнопки "Run Code".
index.html
required
Атрибут required
використовується для того, щоб зробити поле введення обов'язковим для заповнення. Він вказує, що це поле повинно бути заповнене перед відправкою форми. Якщо користувач спробує відправити форму без заповнення обов'язкового поля, з'явиться повідомлення про помилку валідації, яке вказує, що це поле є обов'язковим.
index.html
placeholder
Атрибут placeholder
надає підказку або приклад очікуваного значення для користувача. Короткий текст відображається всередині поля вводу до того, як користувач введе будь-яке значення. Це корисно для полів, які потребують певного формату, наприклад, номер телефону або кредитної картки.
index.html
Примітка
У наведених вище прикладах використано різні атрибути
type
для елементів<input>
, що суттєво впливає на їхній вигляд і функціональність. У наступному розділі ви детальніше ознайомитеся з різними типами полів введення.
1. Який атрибут використовується для встановлення значення за замовчуванням для елемента введення?
2. Який атрибут використовується для встановлення підказки або прикладу очікуваного значення для елемента input
?
3. Який атрибут використовується для вказівки, що поле введення має бути заповнене перед відправленням форми?
Дякуємо за ваш відгук!