jQuery focusout() Method
jQuery focusout() method trigger the focusout event. The jQuery focusout event occurs when an element (or any elements inside it) loses focus. And when the focusout event occurs, specified function will execute.
jQuery blur() method trigger on the selected element. Where as jQuery focusout() method trigger on the selected element including any child elements inside it.
Syntax
This triggers the focusout event for selected elements or any child elements inside it.
$(selector).focusout(); // This syntax does not accept any arguments.
This attach a function to the focusout event.
$(selector).focusout(function);
| Parameter | Type | Description |
|---|---|---|
| function | Function | Optional. Specifies the function to execute when the focusout event is occurs. |
Examples
This example represents the focusout() event.
<!DOCTYPE html>
<html>
<head>
<title>jQuery focusin() and focusout() method</title>
<script src="jquery-latest.min.js"></script>
<script>
$(document).ready(function(){
$("div").focusin(function(){
$(this).css("background-color", "yellow");
});
$("div").focusout(function(){
$(this).css("background-color", "white");
});
});
</script>
</head>
<body>
<p>Click on following text field to occur focusin or focusout events.</p>
<div style="padding:15px 10px;">
Name: <input type="text" name="name" />
</div>
<div style="padding:15px 10px;">
E-mail: <input type="text" name="email" />
</div>
<div style="padding:15px 10px;">
Phone: <input type="text" name="phone" />
</div>
</body>
</html>