Реагировать, как вызвать отправку формы на вход размытия?

Question

Я пытаюсь использовать проверку правильности HTML5 <input type="email" />.

Я могу заставить ее работать нормально, делая это:

<form>
  <input type="email" />
  <input type="submit" />
</form>

Это заставляет валидацию работать нанажав кнопку sumbit.Тем не менее, я хотел бы вызвать форму для отправки при наличии моего email размытия поля.

Как мне вызвать форму без кнопки отправки onBlur?

Вот так:

<form>
  <input type="email" onBlur={/* trigger form submission */} />
</form>

В качестве альтернативы, есть ли лучший подход к выполнению проверки правильности электронной почты в HTML5 при размытости ввода?

Answer 1

использовать нативный checkValidity метод

<form>
  <input type="email" id="a" />
</form>

const a = document.querySelector('#a')


a.addEventListener('blur', e => {
const isValid =  e.target.checkValidity()
console.log(isValid)
})

Answer 2

Поместите атрибут ref в форму и вызовите функцию отправки:

<form ref="myForm">
  <input type="email" onBlur={this.submitForm.bind(this)} />
</form>

Добавьте функцию:

submitForm(){
  this.refs['myForm'].submit()
}