Focus on a text field programmatically

Question

I have the following code

<input type="text" id="text_box1" >

I need to set focus on this field programmatically.

What i tried from the console( after the page has loaded) doesn't seem to work.

1) $('#text_box1').focus();
2) document.getElementById("text_box1").focus();

Any idea on what is wrong here?

I am using jQuery 1.11.3

Answer 1

It works! It must be called once after loading the DOM.

The below function will be called after the DOM are loaded

jQuery:

$(function(){
     //any other code which needs to be called after the DOM is completely loaded
});

Similary, with Javascript

window.onload = function() {
}

$(function(){

$('#text_box1').focus();

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="text_box1" >

Answer 2

just use autofocus attributein form field...

<input type="text" id="text_box1" autofocus />

Answer 3

Use the following JavaScript function, it will work.

<script type="text/javascript">
window.onload = function () 
{
document.getElementById("text_box1").focus();
};
</script>