jQuery blur() is an inbuilt method that is used to remove focus from the selected element. This method starts the blur event or it can be attached a function to run when a blur event occurs.
Syntax:
$(selector).blur(function)Parameters:
It accepts an optional parameter "function".
jQuery examples to show the working of blur() function:
Example 1: In the below code, no function is passed to the blur method.
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
script>
<script>
$(document).ready(function () {
$("#btn").click(function () {
$("input").blur();
$("p").html(
"This is blur method that is used!!!");
});
});
script>
head>
<body>
Enter Value:
<input type="text">
<br><br>
<button id="btn">
start blur event!!!
button>
<p style="color:green">p>
body>
html>
Output:
Example 2: In the below code, function is passed to the blur method.
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
script>
<script>
$(document).ready(function () {
$("input").blur(function () {
$(this).css("background-color", "#ADFF2F");
});
});
script>
head>
<body>
Enter Value:
<input type="text" name="fullname">
body>
html>
Output:
