jsfiddle
这是代码：
<!DOCTYPE html>
<html>
<body>
Input: <input type="text" name="fname" id="fname" onblur="myFunction(this)">
<p>The blur event fires when an element has lost focus.</p>
<script>
function myFunction(ele) {
alert("element has been in blur status, that's why the function is triggered");
ele.focus();
}
</script>
</body>
</html>MDN：模糊事件在元素失去焦点时触发。
因此，当myFunction被触发时，元素就失去了焦点。则myFunction中的警报不会使其再次失去焦点(显然，元素不能失去它所没有的东西)。
警报会阻止该功能，直到用户单击"确定"按钮，对吗？在点击警报弹出中的OK按钮后，元素仍然没有"OK"；焦点"；，对吗？
然后ele.focus()将被触发，现在元素再次聚焦。
但您可以在jsfiddle中尝试，会有一个alert("The onblur event occurs when an object loses focus.")的无限循环，这意味着即使您什么都不做，onblur事件也应该被触发。
这真的很令人困惑，是什么导致了第二次onblr事件的触发？？？
它很简单，因为你不会让元素模糊。该元素处于聚焦状态，直到您点击Alerts(警报)按钮；OK"；按钮在点击"；好的"；按钮它失去焦点并再次触发onblur它进入焦点状态并显示警报。再一次
只需删除ele.focus()，它就可以随心所欲地工作。
我将尝试一步一步地描述：
-
onblur调用
myFunction -
myFunction执行，导致打开报警窗口 -
如果将
ele.focus()留在函数内，则焦点为在输入元素上设置，基本上与弹出报警窗口 -
您按下OK，警报窗口将关闭
-
但是，由于焦点已经回到输入元素上，警报窗口进入无限循环，返回到步骤1。
如果从代码中删除ele.focus()，则不会有3个。和5。一步，一切都会好起来的。
<!DOCTYPE html>
<html>
<body>
Input: <input type="text" name="fname" id="fname" onblur="myFunction(this)">
<p>The blur event fires when an element has lost focus.</p>
<script>
function myFunction(ele) {
alert("element has been in blur status, that's why the function is triggered");
}
</script>
</body>
</html>
EDIT:这里有一个包含console.log的JS fiddle，所以您可以看到它在每次单击"确定"按钮时都会触发。