HTML | DOM onfocusout 事件

介绍

onfocusout事件是HTML DOM中的一个事件，它在元素失去焦点时触发。该事件常用于在用户完成在输入框中的输入后，进行验证或一些处理。

语法

<element onfocusout="myFunction()">

• element: 触发onfocusout事件的元素
• myFunction(): 当onfocusout事件发生时所触发的函数

示例

<input type="text" onfocusout="validateInput()">

<script>
function validateInput() {
  var input = document.getElementsByTagName("input")[0].value;
  if (input === "") {
    alert("请输入内容");
  }
}
</script>

上述代码中，当输入框失去焦点时，将会调用validateInput()函数对输入框中的内容进行验证，若为空则弹出提示窗口。

注意点

• onfocusout事件不会在用户取消选择输入框而失去焦点时触发。
• onblur事件与onfocusout事件的作用相似，不过在IE8及以前版本中不支持onfocusout事件，因此在这些版本中需要使用onblur事件代替。
• 在HTML5中，可以使用addEventListener()方法监听focusout事件。

参考文献

• w3schools
• MDN web docs