如何使用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

我想在页面加载时使用JQuery将焦点放在页面的第一个元素上。通过使用，我可以成功地设置第一个元素的焦点。

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

或

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

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

根据jquery，将焦点设置为页面上第一个启用的输入或选择或textarea。

I tried to use any of the below:

我试着使用以下任何一种:

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

or other variations I could think of, but have not succeeded.

或者其他我能想到的变化，但没有成功。

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

有人能在这个问题上帮助我吗?我是JQuery初学者。

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

我希望这个函数适用于所有主流浏览器。

Thank you very much!

非常感谢!

2 个解决方案

#1

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

问题很可能是，在加载DOM之后，您没有运行代码。试试这个:

$(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.

如果您以这种方式使用它，jQuery将在文档的DOM就绪时触发该函数。

#2

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

您正在调用DOM中未加载的元素。将代码放在就绪函数中。

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

UPDATE:

更新:

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

从@David的回答和评论中可以看出，他是对的。

$(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.

但是您没有正确地包含jquery(如注释所示)。您没有在脚本src之前插入http。

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

#1