HTMLObjectElement: метод setCustomValidity()
Базовая Широко поддерживается
Эта функция хорошо отработана и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с декабря 2018 года.
Метод setCustomValidity() интерфейса HTMLObjectElement устанавливает пользовательское сообщение об ошибке валидации для элемента.
Синтаксис
setCustomValidity(errorMessage)
Параметры
errorMessage-
Сообщение для ошибок валидации.
Возвращаемое значение
None (undefined).
Исключения
Нет.
Примеры
В этом примере мы передаём ID элемента input и устанавливаем разные сообщения об ошибках в зависимости от того, отсутствует ли значение, оно слишком мало или слишком велико. Обратите внимание, что сообщение не отобразится немедленно. Попытка отправить форму отобразит сообщение, или вы можете вызвать метод reportValidity() на элементе.
function validate(inputID) {
const input = document.getElementById(inputID);
const validityState = input.validity;
if (validityState.valueMissing) {
input.setCustomValidity("You gotta fill this out, yo!");
} else if (validityState.rangeUnderflow) {
input.setCustomValidity("We need a higher number!");
} else if (validityState.rangeOverflow) {
input.setCustomValidity("Thats too high!");
} else {
input.setCustomValidity("");
}
input.reportValidity();
}
Необходимо установить сообщение пустой строкой, если ошибок нет. Пока сообщение об ошибке не пустое, форма не пройдёт валидацию и не будет отправлена.
Спецификации
| Спецификация |
|---|
| HTML # dom-cva-setcustomvalidity-dev |
Совместимость с браузерами
| Рабочие столы | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на iOS | Samsung Internet | WebView Android | |
setCustomValidity |
10Этот метод только обновляет всплывающее окно с ошибками валидации, а не подсказку, которая появляется при наведении курсора на элемент, см. ошибку 41380670. |
12 | 4 | ≤12.1 | 5.1 | 18Этот метод только обновляет всплывающее окно с ошибками валидации, а не подсказку, которая появляется при наведении курсора на элемент, см. ошибку 41380670. |
4 | ≤12.1 | 5 | 1.0Этот метод только обновляет всплывающее окно с ошибками валидации, а не подсказку, которая появляется при наведении курсора на элемент, см. ошибку 41380670. |
≤37 |
См. также
© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/HTMLObjectElement/setCustomValidity
