javascript - 调用 focus 方法会导致 onblur 无休止地触发

Question

我想在用户移动到另一个字段时验证输入框。我有以下代码，运行良好。

validate = (v) => {
  if (v.value=="yes") return;
  alert("Value must be exactly 'yes'. Please rectify.");
  //v.focus();
}

<p>Enter only 'yes' in this field:</p>
<input onblur='validate(this);' />

但是，如果我添加调用 focus 方法，以便在继续之前向用户突出显示以修复错误，则 onblur 方法将被无休止地触发。为什么会这样？

fiddle 是https://jsfiddle.net/OldGeezer/8xfLwvn6/4/

在进一步测试中，我发现如果由于单击另一个应用程序窗口而失去焦点，则不会发生无休止的onblur。如果我只是单击网页的另一部分(在 Chrome 中)，就会发生这种情况。

Answer 1

使用 alert() 会从事件元素中移除焦点，从而导致触发 blur。因此，根据您的脚本，blur 会连续触发。使用console.log()可以帮助您更好地理解这一点。