How to set the focus on the first <select> element of the page using JQuery?

I would like to set the focus on the first element of the page using JQuery when the page is loaded. I could successfully set the focus for first element by using

$(":input:visible:first").focus(); 

or

$(':input:enabled:visible:first').focus();

according to jquery, set focus on the first enabled input or select or textarea on the page.

I tried to use any of the below:

$('select:first').focus();
$("select").first().focus();
$(':visible:first').focus();
$('enabled:visible:first').focus();

or other variations开发者_StackOverflow I could think of, but have not succeeded.

Could anyone help me on this problem? I am a beginner to JQuery.

I would like this function to work for all major browsers.

Thank you very much!

The problem is most likely to be that you are not running the code on after the DOM is loaded. Try this one:

$(document).ready(function(){
   $("select:first").focus();
});

That should work.

EDIT: You can simplify the code a bit by using this:

$(function(){
  $("select:first").focus();
})

If you use it that way, jQuery will trigger that function when the document's DOM is ready.

You are calling on element that is not loaded in DOM. Place your code in ready function.

jQuery(document).ready(function() {
    $(":input:visible:first").focus();               
});

UPDATE:

As seen in @David answer and comments, he is right.

$(document).ready(function(){
    $("select:first").focus();
});

but you have not correctly included jquery (as seen in comment). you have missed to insert http before script src.

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>