The HTML DOM onfocusout event occurs when an element is losing focus. The onfocusout is the same as onblur, the only difference is that the onblur event does not bubble. If you want to determine whether an element or its child loses focus, use the onfocusout event. The onfocusin event is the opposite of the onfocusout event.
Note: Firefox does not support the onfocusout event but with the help of capturing listeners you can find out whether a child of an element loses the focus.
Supported Tags: It supports ALL HTML elements, EXCEPT:
- <base>
- <bdo>
- <br>
- <head>
- <html>
- <iframe>
- <meta>
- <param>
- <script>
- <style>
- <title>
Syntax:
In HTML:
<element onfocusout="myScript">
In JavaScript (may not work as expected in Chrome, Safari and Opera 15+):
object.onfocusout = function(){myScript};In JavaScript, using the addEventListener() method:
object.addEventListener("focusout", myScript);Example: Using HTML
<!DOCTYPE html><html>
<body>
<center>
<h1 style="color:green">GeeksforGeeks</h1>
<h2>
HTML DOM onfocusout event
</h2>
Email:
<input type="email" id="email"
onfocusout="gfgFun()">
<script>
function gfgFun() {
let x =
document.getElementById("email");
alert("Focus out");
}
</script>
</center>
</body>
</html>
|
Output:
Example: Using JavaScript
<!DOCTYPE html><html>
<body>
<center>
<h1 style="color:green">
GeeksforGeeks
</h1>
<h2>
HTML DOM onfocusout event
</h2>
Email:
<input type="email" id="email">
<script>
document.getElementById(
"email").onfocusout =
function () {
gfgFun()
};
function gfgFun() {
alert("Focus out");
}
</script>
</center>
</body>
</html>
|
Output:
Example: Using the addEventListener() method:
<!DOCTYPE html><html>
<body>
<center>
<h1 style="color:green">
GeeksforGeeks
</h1>
<h2>
HTML DOM onfocusout event
</h2>
Email:
<input type="email" id="email">
<script>
document.getElementById(
"email").addEventListener(
"focusout", gfgFun);
function gfgFun() {
alert("Input field lost focus.");
}
</script>
</center>
</body>
</html>
|
Output:
Supported Browsers: The browsers supported by HTML DOM onfocusout Event are listed below:
- Google Chrome
- Internet Explorer
- Firefox 52.0
- Apple Safari
- Opera