How to Set Focus With jQuery
The jQuery is a software program that allow users to create a Web page interface from the JavaScript components. It builds the page interface by modifying the Cascading Style Sheets tags. The ".focus()" jQuery function binds an event handler to the JavaScript event or triggers the event on a Web page element. The Web page elements with focus are highlighted by the Web browser to determine which element is the first to receive keyboard-related or mouse-related events. You need to define the event handler in order to set focus on a Web page element with the jQuery program.
Other People Are Reading
Instructions
-
-
1
Click the "Start" button in Windows, and then click on "Notepad."
-
2
Click "Open" followed by "File." Select the Web page HTML file in which you want to set focus on a Web page element with jQuery.
-
-
3
Add the following code at the beginning of your Web page:
<!DOCTYPE html>
<html>
<head>
<style>span {display:none;}</style>
<script src="http://code.jquery.com/jquery.js"></script>
</head>
<body>
<p><input type="text" /> <span>focus fire</span></p>
<p><input type="password" /> <span>focus fire</span></p>
<script>
$("input").focus(function () {
$(this).next("span").css('display','inline').fadeOut
(1000);
});
</script>
</body>
</html>
-
4
Click "File" followed by "Save" to set focus on the Web page element in your jQuery user interface.
-
1
References
- Photo Credit Ablestock.com/AbleStock.com/Getty Images
