Можете ли вы вызвать пользовательские ошибки формы HTML5 с помощью JavaScript?

Question

Если у меня есть вход типа <input type="text"> и я хочу вызвать собственную ошибку на входе, вы можете это сделать? Like (искусственный код) ele.triggerError('Error Message');

Тогда это будет выглядеть так:

ошибка http://tylergaw.com/storage/post_image_htmlFormErrors_defaultChrome.jpg

Но с пользовательским сообщением и для его собственной функции проверки. Например, для проверки AJAX.

Answer 1

Единственный способ вызвать собственную ошибку - это отправить форму.Хотя вы можете установить пользовательское сообщение с помощью setCustomValidity (, как описано в моем ответе здесь ), и вы можете вызвать событие invalid с помощью checkValidityэто только дает вам возможность создать свой собственный пользовательский интерфейс проверки. Вот простой пример , с которым вы можете поиграться, чтобы проверить.

Обратите внимание, что если вы отправляете форму с помощью метода submit(), который обойдет API проверки.Но если вы вызовете событие click кнопки отправки , которая будет работать в Firefox и Opera, но не в Chrome.Я бы избегал делать это прямо сейчас.

Answer 2

Теперь вы можете использовать метод HTMLFormElement.reportValidity (), в настоящий момент он реализован в браузерах Chrome, Firefox, Opera и Android, но не поддерживается в Internet Explorer (проверьте caniuse.com , чтобы увидетьподдерживаемый браузер).