Как установить фокус на поле ввода с помощью JQuery

Question

Как установить фокус на поле ввода с помощью JQuery

учитывая следующую структуру HTML:

<div class="wrapper">

    <div class="top">

        <a href="http://example.com" class="link">click here</a>

    </div>

    <div class="middle">

        some text

    </div>

    <div class="bottom">

        <form>

            <input type="text" class="post">

            <input type="submit">

        </form>

    </div>

<div>

который будет повторяться несколько раз на странице, как мне установить фокус на поле ввода в .bottom div, когда пользователь нажимает на ссылку в .top div?

в настоящее время я делаю .bottom div успешно появляется при щелчке с помощью кода JQuery ниже, но, похоже, не может понять, как одновременно установить фокус на поле ввода.

$('.link').click(function() {

    $(this).parent().siblings('div.bottom').show();

});

спасибо!

629 2

jQuery html

2 ответов:

Comments

Ничего не найдено.

Justin Ethier · Accepted Answer · 2011-07-18 23:27:07

попробуйте это, чтобы установить фокус на первое поле ввода:
$(this).parent().siblings('div.bottom').find("input.post").focus();

MKaama · Accepted Answer · 2016-08-21 10:23:11

ответ Джастина не сработал для меня (Chromium 18, Firefox 43.0.1). в jQuery .focus() создает визуальное выделение, но текстовый курсор не отображается в поле (jquery 3.1.0).

вдохновленный https://www.sitepoint.com/jqueryhtml5-input-focus-cursor-positions/, я добавил автофокус в поле ввода и вуаля!
function addfield() {
    n=$('table tr').length;
    $('table').append('<tr><td><input name=field'+n+' autofocus></td><td><input name=value'+n+'></td></tr>');
    $('input[name="aa"'+n+']').focus();
}