How do you automatically set the focus to a textbox when a web page loads

Question

How do you automatically set the focus to a textbox when a web page loads   Is there an HTML tag to do it or does it have to be done via Javascript

User · Answer

If you are using ASP NET then you can use  yourControlName Focus     in the code on the server  which will add appropriate JavaScript into the page   Other server-side frameworks may have an equivalent method

User · Answer

Simply write autofocus in the textfield  This is simple and it works like this     lt input name  abc  autofocus gt  lt  input gt    Hope this helps

User · Answer

Using plain vanilla html and javascript   lt input type  text  id  txtMyInputBox    gt     lt script language  javascript  type  text javascript  gt  function SetFocus            safety check  make sure its a post 1999 browser     if   document getElementById                return             var txtMyInputBoxElement   document getElementById  txtMyInputBox         if  txtMyInputBoxElement    null                txtMyInputBoxElement focus            SetFocus     lt  script gt    For those out there using the  net framework and asp net 2 0 or above  its trivial   If you are using older versions of the framework  you d need to write some javascript similar to above   In your OnLoad handler  generally page load if you are using the stock page template supplied with visual studio  you can use   C   protected void PageLoad object sender  EventArgs e        Page SetFocus txtMyInputBox       VB NET  Protected Sub PageLoad sender as Object  e as EventArgs       Page SetFocus txtMyInputBox   End Sub      Note I removed the underscore character from the function name that is generally Page Load since in a code block it refused to render properly   I could not see in the markup documentation how to get underscores to render unescaped    Hope this helps

User · Answer

lt html gt     lt head gt     lt script language  javascript  type  text javascript  gt    function SetFocus InputID           document getElementById InputID  focus           lt  script gt     lt  head gt     lt body onload  SetFocus  Box2    gt     lt input id  Box1  size  30    gt  lt br  gt     lt input id  Box2  size  30    gt     lt  body gt     lt  html gt

User · Answer

If you re using jquery     function           Box1   focus          or prototype   Event observe window   load   function          Box1   focus          or plain javascript   window onload   function       document getElementById  Box1   focus         though keep in mind that this will replace other on load handlers  so look up addLoadEvent   in google for a safe way to append onload handlers rather than replacing

User · Answer

You can do it easily by using jquery in this way    lt script type  text javascript  gt         document  ready function                  myTextBoxId   focus              lt  script gt    by calling this function in   document  ready      It means this function will execute when the DOM is ready   For more information about the READY function  refer to   http   api jquery com ready

User · Answer

In HTML there s an autofocus attribute to all form fields  There s a good tutorial on it in Dive Into HTML 5  Unfortunately it s currently not supported by IE versions less than 10   To use the HTML 5 attribute and fall back to a JS option    lt input id  my-input  autofocus  autofocus    gt   lt script gt    if     autofocus  in document createElement  input           document getElementById  my-input   focus         lt  script gt    No jQuery  onload or event handlers are required  because the JS is below the HTML element   Edit  another advantage is that it works with JavaScript off in some browsers and you can remove the JavaScript when you don t want to support older browsers   Edit 2  Firefox 4 now supports the autofocus attribute  just leaving IE without support

User · Answer

As a general advice  I would recommend not stealing the focus from the address bar   Jeff already talked about that    Web page can take some time to load  which means that your focus change can occur some long time after the user typed the pae URL  Then he could have changed his mind and be back to url typing while you will be loading your page and stealing the focus to put it in your textbox   That s the one and only reason that made me remove Google as my start page   Of course  if you control the network  local network  or if the focus change is to solve an important usability issue  forget all I just said

User · Answer

You need to use javascript    lt BODY onLoad  document getElementById  myButton   focus     gt       Ben notes that you should not add event handlers like this  While that is another question  he recommends that you use this function   function addLoadEvent func      var oldonload   window onload    if  typeof window onload     function         window onload   func      else       window onload   function           if  oldonload            oldonload                  func                  And then put a call to addLoadEvent on your page and reference a function the sets the focus to you desired textbox

User · Answer

Use the below code  For me it is working  jQuery   id   hfSpecialty ids     focus

User · Answer

IMHO  the  cleanest  way to select the First  visible  enabled text field on the page  is to use jQuery and do something like this     document  ready function          input text value     visible enabled first   focus          Hope that helps     Thanks

User · Answer

I had a slightly different problem  I wanted autofocus  but  wanted the placeholder text to remain  cross-browser  Some browsers would hide the placeholder text as soon as the field focused  some would keep it  I had to either get placeholders staying cross-browser  which has weird side effects  or stop using autofocus   So I listened for the first key typed against the body tag  and redirected that key into the target input field  Then all the event handlers involved get killed off to keep things clean   var urlInput       Url     function bodyFirstKey ev           body   off  keydown   bodyFirstKey       urlInput off  focus   urlInputFirstFocus        if  ev target    document body            urlInput focus            if   ev ctrlKey  amp  amp   ev metaKey  amp  amp   ev altKey                urlInput val ev key               return false                     function urlInputFirstFocus            body   off  keydown   bodyFirstKey       urlInput off  focus   urlInputFirstFocus          body   keydown bodyFirstKey   urlInput focus urlInputFirstFocus     https   jsfiddle net b9chris qLrrb93w

User · Answer

It is possible to set autofocus on input elements   lt input type  text  class  b calle  id  b calle  placeholder  Buscar por nombre de calle  autofocus  autofocus  gt

[javascript] How do you automatically set the focus to a textbox when a web page loads?

Examples related to javascript

Examples related to html