JavaScript Textarea Object : onblur Event handler
Description
The onblur event handler of textarea object is defined in an <textarea> and </textarea> (i.e. <textarea name="mytextarea" onblur = "JavascriptCode"> </textarea>). It executes some JavaScript code or function when a textarea object loses focus either by the pointing device (for example mouse) or by pressing tab key.
Version
Implemented in JavaScript 1.0
Syntax
onblur = "JavascriptCode"
Parameter
JavascriptCode : JavaScript statement or JavaScript function.
Example of Textarea object : onblur event handler
In the following web document onblur event handler execute a function (which convert the text box characters in uppercase) when the textarea object loses focus.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JavaScript Textarea object's Event handler : onblur Example</title>
<script type="text/javascript">
function textupper()
{
document.form1.TextArea.value=document.write
(document.form1.TextArea.value.toUpperCase())
}
</script>
</head>
<body>
<h1 style="color: red">JavaScript Textarea Object's Event handlers : onblur</h1>
<h3>Input some data in textarea field, then press tabkey or click on the Submit button, Textarea box characters will be converted
to uppercase.</h3>
<hr />
<form name="form1" action="#">
<p>Input your details :</p>
<textarea name="TextArea" rows="5" cols="50" onblur='textupper()'></textarea>
<br />
<input type="submit" name="Submit" value="Submit" />
</form>
</body>
</html>
View the example of textarea object's onblur event handler in the browser
Practice textarea object's onblur event handler with Online Editor
Supported Browser
| Internet Explorer 7 | Firefox 3.6 | Google Chrome 7 | Safari 5.0.1 | Opera 10 |
| Yes | Yes | Yes | No | Yes |
See also :
Please Google+, Like this tutorial on FaceBook, Tweet, save it as bookmark and subscribe with our Feed. Have suggestions? comment using Disqus down this page. Thanks.
