w3resource

HTML onblur attribute

onblur

The purpose of the HTML onblur attribute is to indicate the user agent that the element has lost focus. The value of this attribute points to a script, which is executed when the element loses focus.

Supported elements

HTML onblur attribute supports a, area, button, input, label, select, textarea elements.

onblur can be effectively applied on form elements.

Syntax

<ElementName onblur="value" >.....</ElementName>

Type of value

Script.

Value

A script which is to be executed.

Default value

There is no default value of HTML onblur attribute.

Supported doctypes

HTML 4.01 strict, HTML 4.01 transitional, HTML 4.01 frameset.

Example of HTML onblur attribute with form elements

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Example of HTML onblur attribute with form elements</title>
</head>
<body>
<form name="onblur_example" action=""> 
Name : <input type="text" name="name" onblur="alert('name field has lost focus')"><br>
<label>Favorite Sports </label> 
<select name="favourite_sports" onblur="alert('favourite_sports has lost focus')">
<option value="Soccer">Soccer</option>
<option value="Hockey">Hockey</option>
<option value="Tennis">Tennis</option> 
<option value="Golf">Golf</option> 
</select><br>
<label>Describe yourself in short : </label>   <br><textarea cols="10" rows="10" name="describe_ yourself" onblur="alert('describe_ yourself has lost focus')">   </textarea><br>
<button type="button" name="submit">Submit</button>
</form>
</body>
</html>

Result

html onblur attribute with form elements

View this example in a separate browser window

Example of HTML onblur attribute with form elements

Previous: HTML noresize attribute
Next: HTML onchange attribute

Test your Programming skills with w3resource's quiz.



Become a Patron!

Follow us on Facebook and Twitter for latest update.

It will be nice if you may share this link in any developer community or anywhere else, from where other developers may find this content. Thanks.

https://www.w3resource.com/html/attributes/html-onblur-attribute.php