How can I set focus on an element in an HTML form using JavaScript

Question

I have a web form with a text box in it  How do I go about setting focus to the text box by default  Something like this   lt body onload  setFocusToTextBox    gt   so can anybody help me with it  I don t know how to set focus to the text box with JavaScript   lt script gt    function setFocusToTextBox          What to do here      lt  script gt

User · Answer

For what it s worth   you can use the autofocus attribute on HTML5 compatible browsers  Works even on IE as of version 10    lt input name  myinput  value  whatever  autofocus   gt

User · Answer

If your  lt input gt  or  lt textarea gt  has attribute id mytext then use  mytext focus       x000D   x000D  function setFocusToTextBox     x000D      mytext focus    x000D    x000D   lt body onload  setFocusToTextBox    gt  x000D     lt form gt  x000D       lt input type  text  id  mytext   gt  x000D     lt  form gt  x000D   lt  body gt  x000D   x000D   x000D

User · Answer

Do this   If your element is something like this     lt input type  text  id  mytext   gt    Your script would be   lt script gt  function setFocusToTextBox        document getElementById  mytext   focus       lt  script gt

User · Answer

As mentioned earlier  document forms works too   function setFocusToTextBox   element       document forms   myFormName    elements   element   focus       setFocusToTextBox  0       sets focus on first element of the form

User · Answer

For plain Javascript  try the following   window onload   function       document getElementById  TextBoxName   focus

User · Answer

window onload is to put focus initially onblur is to put focus while you click outside of the textarea or avoid text area blur       lt textarea id  focus  gt  lt  textarea gt       lt script gt       var mytexarea document getElementById  focus        window onload function              mytexarea focus            mytextarea onblur function     mytextarea focus            lt  script gt

User · Answer

If your code is    lt input type  text  id  mytext   gt    And If you are using JQuery  You can use this too    lt script gt  function setFocusToTextBox            mytext   focus       lt  script gt    Keep in mind that you must draw the input first   document  ready

User · Answer

I used to just use this    lt html gt     lt head gt       lt script type  text javascript  gt        function focusFieldOne             document FormName FieldName focus                 lt  script gt     lt  head gt      lt body onLoad  focusFieldOne     gt       lt form name  FormName  gt        Field  lt input type  text  name  FieldName  gt       lt  form gt     lt  body gt   lt  html gt    That said  you can just use the autofocus attribute in HTML 5   Please note  I wanted to update this old thread showing the example asked plus the newer  easier update for those still reading this

User · Answer

Usually when we focus on a textbox  we should also scroll into view  function setFocusToTextBox        var textbox   document getElementById  yourtextbox        textbox focus        textbox scrollIntoView        Check if it helps

[javascript] How can I set focus on an element in an HTML form using JavaScript?

Examples related to javascript

Examples related to html

Examples related to textbox

Examples related to focus