HTML onblur event Attribute
Example
<input type="text" name="fname" id="fname" onblur="myFunction()">
<p id="demo"></p>
<script>
function myFunction() {
var x = document.getElementById("fname");
document.getElementById("demo").innerHTML = x.value;
}
</script>Meaning
The onblur attribute occurs when an element loses focus, meaning that the user has moved focus to another element, typically either by clicking the mouse or by tabbing.
Standard Syntax
<element onblur="script">Browser Support
Status
Attribute Values
| Value | Description |
|---|---|
| script | Specifies the script to be run on onblur. |
Technical Details
Supported HTML elements:
All HTML elements, EXCEPT: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, and <title>More Example
Example
<input onblur="myBlur()" onfocus="myFocus()" id="demo" type="text" placeholder="Try to focus me!" />
<script>
let x = document.getElementById("demo");
function myBlur(){
x.style.background = "red";
}
function myFocus(){
x.style.background = "green";
}
</script>