19 Feb jQuery focusout() method
Definition
Trigger an event when an element loses focus, using the jQuery focusout() method. It triggers even if any child element lose focus.
Note: The focusout() method is used often along with focusin().
Syntax
The following is the syntax,
$(selector).focusout(func)
The following is the parameter used in the jQuery focusout() method,
- func: When event occur, this function runs. It is an optional parameter.
Example
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("input").focusin(function(){
$("span").css("display", "inline");
});
$("input").focusout(function(){
$("span").css("color", "blue");
});
});
</script>
<style>
span {
display: none;
}
</style>
</head>
<body>
<p>Enter subject details below,</p>
<p><input type="number">
<span>Enter subject id</span>
</p>
<p><input type="text">
<span>Enter subject name</span>
</p>
<p><input type="text">
<span>Enter student name</span>
</p>
</body>
</html>
The following is the output,
Click inside the input field to get focus,
Click outside the input field to get focus,
No Comments