Как изменить текст всплывающего предупреждения required pattern?

#javascript #html #jquery #css

В хроме так:


В разных браузерах текста предупреждений отличаются
    

Ответы

Ответ 1

Можно задать свое сообщение, в зависимости от типа ошибки.  В каждом input содержится
специальный объект validity, включающий в себя список булевых значений(true или false),
характеризующих ту или иную проверку на валидность. Список свойств этого объекта с
описанием на русском языке: https://htmlacademy.ru/blog/95-form-validation-techniques



$('input').on('input invalid', function() {
    this.setCustomValidity('')
    if (this.validity.valueMissing) {
      this.setCustomValidity("Нет значения")
    }
    if (this.validity.typeMismatch) {
      this.setCustomValidity("Не соответствует типу")
    }
    if (this.validity.patternMismatch) {
      this.setCustomValidity("Не соответствует паттерну")
    }
})


  
  
  
  



Ответ 2

HTML5 текст валидации вы изменить не можете, но для pattern текст тайтла записать
можно нативными способами:

example1: 




example2:


    



Ответ 3

А не проще подключить js-валидацию и выводить ошибки каким-нибудь Popovers?
Вот простой пример:    See the Pen https://codepen.io/CognitoForms/pen/mxvdGV/'>Form
Validation Styles: After by Cognito Forms (https://codepen.io/CognitoForms'>@CognitoForms)
on https://codepen.io'>CodePen.