Home Tutorial Jquery jQuery blur event

 
 

Share on Google+Share on Google+
jQuery blur event
Posted on: July 29, 2010 at 12:00 AM
Advertisement
In this tutorial , we will discuss how to handle blur event of jQuery.

jQuery blur event

In this tutorial , we will discuss how to handle blur event of jQuery. In the below example , there are two input field ,when you click inside or change text of the  first input field and after it, you click on any other elements in the page ,it shows an alert box .The blur event is sent to an element when it loses focus. An element can lose focus via keyboard commands, such as the Tab key, or by mouse clicks elsewhere on the page.

formBlur.html

<!DOCTYPE html>
<html>
<head>
<script src="jquery-1.4.2.js"></script>
</head>
<body>
<form>
<input id="Flag" type="text" value="Input 1" />
<input type="text" value="Input 2" />
</form>
<div id="other">
Switch the handler
</div>
Click on first input field & after it, click out side.
<script>
$('#Flag').blur(function() {
alert('You clicked in other than first input field');
});
</script>
</body>
</html>

OUTPUT

When First input field loses focus :

Download Source Code

Click here to see demo

Advertisement

Related Tags for jQuery blur event:


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: July 29, 2010

Recommend the tutorial

Advertisements Advertisements
 

 

 

DMCA.com