阻止焦点调用模糊功能

Question

如果验证失败，我正在验证电子邮件地址并创建警报消息。当用户单击警报消息上的“确定”时，应将焦点返回到电子邮件地址文本框。

我遇到对焦功能问题，即调用模糊，然后模糊功能又调用焦点。它正在无限循环中运行。请参考下面的示例-

BlurAndFocusIssue

input.onblur = function() {
  samp.innerHTML="Called blur";
  if (!input.value.includes('@')) { 
    input.classList.add('invalid');
    alert('Please enter a correct email.');
    document.getElementById("input").focus();
  }
};


input.onfocus = function() {
  samp.innerHTML="Called focus";
  if (this.classList.contains('invalid')) {
    this.classList.remove('invalid');
    error.innerHTML = "";
  }
};

一旦焦点位于电子邮件地址内，我需要允许用户输入该电子邮件地址并在onBlur功能上对其进行验证。

Answer 1

使用click控制setTimeout()

JSFiddle

Onblur