IE - Как отключить проверку правильности ввода после отправки формы?

Question

У меня есть ввод, который просит пользователя ввести действительное электронное письмо, затем я очищаю ввод при отправке.
Проблема возникает в IE, если пользователь отправил недействительное письмооднажды, обратная связь обнаружения (красная граница) все еще существует даже после отправки действительного электронного письма, поскольку вход был очищен.
Есть ли способ остановить проверку после отправки действительного ввода?

const form = document.querySelector('form');
const input = document.querySelector('input');
form.addEventListener('submit', function(event) {
  event.preventDefault();
  /*
    stuff to do with the email
  */
  input.value = '';
})

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

Answer 1

вместо очистки ввода вручную, вы можете просто сбросить форму после отправки:

const form = document.querySelector('form');
const input = document.querySelector('input');
form.addEventListener('submit', function(event) {
  event.preventDefault();
  /*
    stuff to do with the email
  */
  //input.value = '';
  form.reset();
})

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

Answer 2

Я нашел это! Похоже, это можно сделать с помощью CSS:)

Похоже, что Firefox добавляет собственный псевдокласс для добавления box-shadow к элементу ввода, вы также можете отключить это.

Я сделал это JSFiddle . Мой IE11 показывает сообщение «Это обязательное поле», но не показывает красную рамку

const form = document.querySelector('form');
const input = document.querySelector('input');
form.addEventListener('submit', function(event) {
  event.preventDefault();
  /*
    stuff to do with the email
  */
  input.value = '';
})

/* Firefox */
input:-moz-ui-invalid{
  box-shadow:none;
}

/* Internet Explorer */
input:invalid{
    outline:none;
}  

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