Как сфокусироваться на текстовом поле на основе клика?

У меня есть код, который, когда пользователь нажимает ссылку «Добавить комментарий», рядом с ним отображается определенный именованный div и слайдер перемещает этот div вниз. Внутри этого div у меня есть текстовое поле.

Моя цель - установить фокус на текстовую область, когда пользователь нажимает ссылку "Добавить комментарий". Проблема, с которой я сталкиваюсь, заключается в том, что у меня будет несколько комментариев/текстовых полей/добавить ссылки на комментарии, и мне это нужно, поэтому, когда вы нажимаете «Добавить комментарий», он фокусируется на соответствующем текстовом поле.

Вот что у меня есть до сих пор:

jQuery

$(".add-comment-btn").click(function(){
    $(this).next(".inline-comment-form").slideToggle(200);
    $(this).next(".inline-comment-form textarea").focus();
    return false;
});

HTML

<a class="add-comment-btn" href="#">Add Comment</a>         

<div class="inline-comment-form">
<form action="" method="post">
        <div class="textarea">
            <textarea class="inline-comment-textarea" name="comment-textarea"></textarea>
        </div>
        <input value="SUBMIT" name="submit-inline-comment" class="form-btn" type="submit">

    </form>
</div><!--/Inline Comment Form -->  

Изменить: я обновил код, добавив ссылку "Добавить комментарий" и переместив возвращаемое значение false


person hybrid    schedule 18.05.2011    source источник
comment
не могли бы вы опубликовать больший мусор HTML, который включает в себя добавление комментария? Я хочу дать вам ссылку jsbin с демонстрацией, но я хочу убедиться, что HTML такой же :)   -  person Oscar Godson    schedule 18.05.2011
comment
Вы имеете в виду вернуть false перед вызовом фокуса? Это, конечно, не сработает.   -  person John Green    schedule 18.05.2011
comment
Да, это настоящий гибрид, если вы можете переместить return false в самый конец, сделайте это. Если нет, попробуйте изменить ‹a› на ‹span› или что-то в этом роде и просто стилизуйте его.   -  person Oscar Godson    schedule 18.05.2011
comment
@Oscar - Извините, я думаю, что верхний бит кода был обрезан в первый раз. @Джон - Спасибо за эту информацию. Я не знал об этом. Итак, если я использую return false; это должно идти в самом конце?   -  person hybrid    schedule 18.05.2011
comment
Да, return false в основном похож на перерыв; или убить; на других языках. На этом он остановится и выпрыгнет из текущей области (поправьте меня, если я ошибаюсь, другие люди в StackOverflows)   -  person Oscar Godson    schedule 18.05.2011
comment
Если перемещение return false ВСЕ ЕЩЕ не исправит ситуацию, я покажу вам демонстрацию JSBin!   -  person Oscar Godson    schedule 18.05.2011


Ответы (2)


http://jsfiddle.net/Frgxv/

$(".add-comment-btn").click(function(){
    $(this).next(".inline-comment-form").slideToggle(200)
           .find("textarea").focus();

    return false;
});

next работает только с братьями и сестрами, текстовое поле не является братом.

person James Montagne    schedule 18.05.2011
comment
Круто, это именно то, что я искал. Я смутно помню это качество в следующем, спасибо, что напомнили. - person hybrid; 18.05.2011

Эй, попробуйте: http://jsfiddle.net/jackrugile/XNkES/

Я использую следующий код, который, кажется, работает:

$(this).next(".inline-comment-form").slideToggle(200).find('textarea').focus();
person jackrugile    schedule 18.05.2011
comment
Потрясающий! Это именно то, что я искал! Спасибо, jackrugile. - person hybrid; 18.05.2011