Как сделать пользовательское сообщение об ошибке проверки?

Question

Как сделать такое сообщение об ошибке?Я создаю форму проверки логина.

Answer 1

Кроме того:

Вы можете использовать customValidity api для создания пользовательских сообщений и использовать всплывающую подсказку по умолчанию, предоставленную браузером.

DOCS: https://developer.mozilla.org/en-US/docs/Web/API/ValidityState

Проверьте ниже простой пример:

https://jsbin.com/popazajawu/2/edit?html,js,console,output

JS:

var inputs = document.querySelectorAll('input');

inputs.forEach(input => {
  input.addEventListener('invalid', function(e) {
    e.target.setCustomValidity("[CUSTOM MESSAGE] This field cannot be left blank")
  })

  input.addEventListener('input', function(e) {
    e.target.setCustomValidity("");
  })
})

Answer 2

Вы можете попробовать это так же просто, как это

<input type= "text" name= "name" pattern= "[0-9]" required="required">

Вы также можете установить Длина