Home >Web Front-end >HTML Tutorial >html event attribute onfocus that is triggered when an element gains focus

html event attribute onfocus that is triggered when an element gains focus

黄舟Original: 2017-11-04 11:39:045258browse

Example

Execute a JavaScript when an input field gets focus:

<input type="text" id="fname" onfocus="setStyle(this.id)">

Browser support

##IE

Firefox

Chrome

Safari

Opera

##All major browsers support the onfocus attribute.

Definition and Usage

The onfocus attribute is triggered when an element receives focus.

onfocus is commonly used in d5fd7aea971a85678ba271703566ebfd, 221f08282418e2996498697df914ce4e and 3499910bf9dac5ae3c52d5ede7383485.

Tip: The onfocus attribute is the opposite of the onblur attribute.

Note: The onfocus attribute does not apply to the following elements: dde6fb694e6711ae5e6f381704c04ae4, 71af07a0e88a1ac1ff73f855702ac153, 0c6dc11e160d3b678d68754cc175188a, 93f0f5c25f18dab9d176bd4f6de5d30e, 100db36a723c770d327fc0aef2ce13b1, d5ba1642137c3f32f4f4493ae923989c, e8e496c15ba93d81f6ea4fe5f55a2244 , 0c68fef83818661b6da588c77ca3985e, 3f1c4e4b6b16bbbd69b2ee476dc4f83a, c9ccee2e6ea535a969eb3f532ad9fe89 or b2386ffb911b14667cb8f0f91ea547a7.

Differences between HTML 4.01 and HTML5

None.

Syntax

<element onfocus="script">

Attribute value

ValuescriptonFocus is an event in JavaScript that occurs when an object gets focus. The simplest example is an input box on a web page. When the input box is clicked with the mouse When the input box is selected and content can be input, it is when the input box gains focus. At this time, the input box will trigger the onFocus event.

Description
Script to run when onfocus occurs.

Tool materials: editor, browser

1. Make an input box, bind an onFocus event to the input box, and change the background of the input box to yellow when the user triggers the event. , the code is as follows:

<html>
<head>
<script type="text/javascript">
function setStyle(x)
{
document.getElementById(x).style.background="yellow"
}
</script>
</head>
 
<body>
 
First name: <input type="text"
onfocus="setStyle(this.id)" id="fname" />
<br />
Last name: <input type="text"
onfocus="setStyle(this.id)" id="lname" />
 
</body>
</html>

The above is the detailed content of html event attribute onfocus that is triggered when an element gains focus. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：oncontextmenu event in html that runs a script when the context menu is triggeredNext article：oncontextmenu event in html that runs a script when the context menu is triggered

See more

html event attribute onfocus that is triggered when an element gains focus

Related articles