it-swarm.com.ru

Как сфокусироваться на текстовом поле ввода формы при загрузке страницы с помощью jQuery?

Это, вероятно, очень просто, но может кто-нибудь сказать мне, как заставить курсор мигать в текстовом поле при загрузке страницы?

212
chris

Установить фокус на первое текстовое поле:

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

Это также делает первое текстовое поле, но вы можете изменить [0] на другой индекс:

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

Или вы можете использовать идентификатор:

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

Вы можете использовать HTML5 autofocus для этого. Вам не нужен jQuery или другой JavaScript. 

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

Обратите внимание, что это не будет работать на IE9 и ниже.

74
Andrew Liu

Конечно:

<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>
26
Pandincus

Почему все используют jQuery для чего-то простого, как это. 

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

Подумайте о своем пользовательском интерфейсе, прежде чем сделать это. Я предполагаю (хотя ни один из ответов не сказал так), что вы будете делать это, когда документ загружается с использованием функции ready() в jQuery. Если пользователь уже сфокусировался на другом элементе до того, как документ был загружен (что вполне возможно), для него крайне раздражает, что фокус был украден.

Вы можете проверить это, добавив атрибуты onfocus в каждый из ваших элементов <input>, чтобы записать, фокусировался ли пользователь уже на поле формы, а затем не красть фокус, если они имеют:

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">
18
Tim Down

HTML:

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

jQuery:

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

Извините, что столкнулся со старым вопросом. Я нашел это через Google.

Также стоит отметить, что можно использовать более одного селектора, поэтому вы можете использовать любой элемент формы, а не только один конкретный тип.

например.

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

Это сосредоточит внимание на первом вводе или текстовой области, которую он найдет, и, конечно, вы можете добавить и другие селекторы в микс. Если вы не можете быть уверены в том, что какой-то конкретный тип элемента является первым, или если вы хотите что-то более общее/многоразовое.

8
Andrew Calder

Это то, что я предпочитаю использовать:

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

место после ввода

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

Самый простой и легкий способ добиться этого

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

Одна строка $('#myTextBox').focus() не поместит курсор в текстовое поле, вместо этого используйте:

$('#myTextBox:text:visible:first').focus();
0
David Sopko