如何使用jQuery关注页面加载上的表单输入文本字段?

This is probably very simple, but could somebody tell me how to get the cursor blinking on a text box on page load?

这可能非常简单，但是有人能告诉我如何让光标在页面加载的文本框上闪烁吗?

10 个解决方案

#1

306

Set focus on the first text field:

设置焦点在第一个文本字段:

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

This also does the first text field, but you can change the [0] to another index:

这也是第一个文本字段，但是您可以将[0]更改为另一个索引:

$('input[@type="text"]')[0].focus();

Or, you can use the ID:

或者，您可以使用ID:

$("#someTextBox").focus();

#2

You can use HTML5 autofocus for this. You don't need jQuery or other JavaScript.

你可以用HTML5自动对焦。不需要jQuery或其他JavaScript。

<input type="text" name="some_field" autofocus>

Note this will not work on IE9 and lower.

注意，这对IE9和更低的版本都不起作用。

#3

Sure:

肯定的:

<head>
    <script src="jquery-1.3.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {
            $("#myTextBox").focus();
        });
    </script>
</head>
<body>
    <input type="text" id="myTextBox">
</body>

#4

Why is everybody using jQuery for something simple as this.

为什么每个人都用jQuery来做这么简单的事情呢?

<body OnLoad="document.myform.mytextfield.focus();">

#5

Think about your user interface before you do this. I assume (though none of the answers has said so) that you'll be doing this when the document loads using jQuery's ready() function. If a user has already focussed on a different element before the document has loaded (which is perfectly possible) then it's extremely irritating for them to have the focus stolen away.

在此之前，请考虑您的用户界面。我假设(尽管没有一个答案这么说过)，当使用jQuery ready()函数加载文档时，您将会这样做。如果用户在加载文档之前已经关注了一个不同的元素(这是完全可能的)，那么他们就会非常恼火，因为他们的焦点被窃取了。

You could check for this by adding onfocus attributes in each of your <input> elements to record whether the user has already focussed on a form field and then not stealing the focus if they have:

您可以通过在每个元素中添加onfocus属性来检查用户是否已经将焦点集中在表单字段上，然后如果他们有:

var anyFieldReceivedFocus = false;

function fieldReceivedFocus() {
    anyFieldReceivedFocus = true;
}

function focusFirstField() {
    if (!anyFieldReceivedFocus) {
        // Do jQuery focus stuff
    }
}


<input type="text" onfocus="fieldReceivedFocus()" name="one">
<input type="text" onfocus="fieldReceivedFocus()" name="two">

#6

HTML:

  <input id="search" size="10" />

jQuery:

$("#search").focus();

#7

Sorry for bumping an old question. I found this via google.

对不起，我把一个老问题给撞了。我是通过谷歌找到的。

Its also worth noting that its possible to use more than one selector, thus you can target any form element, and not just one specific type.

同样值得注意的是，可以使用多个选择器，因此您可以针对任何表单元素，而不仅仅是一个特定类型。

eg.

如。

$('#myform input,#myform textarea').first().focus();

This will focus the first input or textarea it finds, and of course you can add other selectors into the mix as well. Hnady if you can't be certain of a specific element type being first, or if you want something a bit general/reusable.

这将聚焦它找到的第一个输入或textarea，当然，您也可以在混合中添加其他选择器。如果您不能确定一个特定的元素类型是first，或者如果您想要一些通用的/可重用的东西。

#8

This is what I prefer to use:

这是我喜欢使用的:

<script type="text/javascript">
    $(document).ready(function () {
        $("#fieldID").focus(); 
    });
</script>

#9

place after input

在输入

<script type="text/javascript">document.formname.inputname.focus();</script>

#10

The Simple and easiest way to achieve this

这是最简单的方法

$('#button').on('click', function () {
    $('.form-group input[type="text"]').attr('autofocus', 'true');
});

#1

306