HTML onfocus Event Attribute
Description
The event attribute onfocus allows you to set the script to fire when an element receives focus.
Syntax
<element onfocus="script">Values
- scriptThe name of the script to use when the event has been triggered.
Example
<!DOCTYPE html>
<html>
<head>
<title>onfocus event</title>
</head>
<body>
<p>Click on the field, and then next to it. When you click on an element, due to the onfocus event attribute, the script is triggered when the element receives focus, and thanks to the onblur event attribute, the script is launched when the focus is lost.</p>
<input type="text" name="testInput" id="testInput" onblur="blurFunction()" onfocus="focusFunction()">
<script>
function blurFunction() {
document.getElementById("testInput").style.background="khaki";
}
function focusFunction() {
document.getElementById("testInput").style.background="red";
}
</script>
</body>
</html>Supported Tags
All HTML elements except:
<base>,
<bdo>,
<br>,
<head>,
<html>,
<iframe>,
<meta>,
<param>,
<script>,
<style> and
<title>
Browser Support
| Desktop | |||||
 |
 |
 |
 |
 |
 |
| 9 | 12 | 1 | 9 | ≤12.1 | 1 |
| Tablets / Mobile | |||||
 |
|
|
|
|
 |
| 1 | 18 | 9 | ≤12.1 | 1 | 1.0 |
Share this Page
If you have enjoyed using CSSPortal, please consider sharing this page with other users, just click on your preferred social media link or copy the webpage from the link below.
URL