html tutorial - onblur Attribute in HTML - html5 - html code - html form
Learn html - html tutorial - Onblur attribute in html - html examples - html programs
- The onblur attribute is used to trigger an event when the element loses its focus.
- Onblur attribute is mostly used for the form validation code.
- The onblur attribute is a part of an Event Attributes.
Syntax for onblur attribute in HTML:
<element onblur="script">Applies to:
| Elements | Attribute |
|---|---|
| All HTML Elements | onblur |
Attributes Values of onblur attribute in HTML:
| Value | Description |
|---|---|
| Script | The script can run on onblur |
Sample coding for onblur attribute in HTML:
Tryit<!DOCTYPE html>
<html>
<head>
<title>Wikitechy HTML onblur attribute</title>
</head>
<body>
Enter the text:
<input type="text" id="txtname" onblur="Onblur()">
<script>
function Onblur() {
var a = document.getElementById("txtname");
a.value = a.value.toLowerCase();
</script>
</body>
</html>Code Explanation for onblur attribute in HTML:
- Onblur attribute calls the JavaScript function onBlur() and is used to define that the element in the text box loses its focus.
- The function onBlur() is used to transforms the textbox text to lower case.
Output for onblur attribute in HTML:
- If we type the text “WIKITECHY” in uppercase in the text box.
- When the textbox loses its focus the text “wikitechy” turns into lowercase.
Browser Support for onblur attribute in HTML:
 |
 |
 |
 |
 |
|---|---|---|---|---|
| Yes | Yes | Yes | Yes | Yes |