Home Javascript JavaScript focus method
Questions:Ask|Latest


 
 

Share on Google+Share on Google+

JavaScript focus method

Advertisement
JavaScript focus method can be used to set focus to the current window, to the input text box , to the specific button or to any radio button and many more elements.

JavaScript focus method

     

JavaScript focus method can be used to set focus to the current window, to the input text box , to the specific button or to any radio button and many more elements. This provides the programmer to create a user-friendly code to work with. Here in this part of JavaScript methods tutorial we are providing you a simple example to set the focus to the input text box. Not only it will set the focus to the input text box, at the same time it will input the text "RoseIndia" in the input box.

Syntax:

 element_Object.focus();

Where element_Object is the element to whom we have to set focus for further working.

Description of Code

In the following code we have created the function setFocus() in the JavaScript to show the use of "focus()" method. This function would be called when any user clicks on the button "Set Focus !" or when user focuses the given input text box. Given below is the html code for focusExample.html

 <html>
<body>
<script language="JavaScript">
  function setFocus() {
  document.getElementById('txt').focus();
   document.getElementById('txt').value='RoseIndia';
  }
</script>
<div style="background: #cf2255; width:'100%';" align="center">
  <font color="#05ff20" size="12pt">
   <b>Focus Example</b>
  </font>
</div>
<center>
  <div style="background: #ffffcc; width:'100%';" align="center">
   <input  id="txt" type="text" value="" onFocus="setFocus();"/>
   <input  type="button" value="Set Focus !" onclick="setFocus();"/>
  <div>
</body>
</html>

Output :

click on the Set Focus! button to set the focus to the text box.

It will write text "RoseIndia" in the text box and as well as set focus to the last of the text box character position. You can also download the html code.

Download Source Code

     

Advertisement

Liked it!  Share this Tutorial


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: January 29, 2009

Ask Questions?    Discuss: JavaScript focus method  

Post your Comment


Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
 
 
Comments
kautik
August 26, 2011
need JavaScript

how to focus on textbox after click on button. i want after click on button it's automatically focus on textbox without clicking on textbox.
ravi shanakar reddy
March 28, 2012
find focus of textbox runtime using javascript

i have 3 text boxes and 0 to 9 buttons.. i want to display the digits in the textbox which has focused actually when i clicked buttons.. can any one help me
SATHYA
March 30, 2012
Focus

How could i set focus in third or second position in textbox using javascript or ASP.net.but i want to do in client side only.
mobo
August 5, 2012
Thanks

hello, Thanks a lot for your guidance. the guidance very helpful for me. good luck
DMCA.com