jQuery Remove Focus from TextBox / Text Field Example

Introduction:

Here I will explain how to use jQuery to remove focus from text field with example or remove focus from textbox using jQuery or remove focus from input field with jQuery. In jQuery by using blur() property we can remove focus from input textbox field.

Description:

In previous articles I explained jQuery set focus on first textbox during page load, jQuery change textbox background color on focus, JavaScript move cursor to next field automatically once text full, JavaScript Onclick select all text from textbox / textarea,  jQuery show / hide div on scroll example, jQuery show / hide div when checkbox is checked (selected), jQuery show / hide / toggle div example, jQuery show images in 360 degree view plugins and many articles relating to css, AngularJS, jQuery, JavaScript and asp.net. Now I will explain how to remove focus from input textbox field in jQuery with example.


To remove focus from textbox / text field in jQuery we need to write the code like as shown below

$('#txtname').blur();


Here if you observe above syntax we are removing focus from textbox using blur() property.

If you want to check it in complete example you need to write the code like as shown below


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Remove Focus From Text Field Example</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
$(function(){
$('#txtname').focus()
$('#btnRemove').click(function(){
$('#txtname').blur();
})
})
</script>
</head>
<body>
<form id="form1">
<div>
Enter Name: <input type="text" id="txtname" />
<input type="button" id="btnRemove" value="Click to Remove Focus" />
</div>
</form>
</body>
</html>

No comments:

Post a Comment

Flipkart