Cách đặt tiêu điểm cho trường nhập liệu bằng JQuery

Cho cấu trúc HTML sau:

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

sẽ được lặp lại nhiều lần trên trang, làm cách nào để đặt tiêu điểm vào trường nhập trong .bottomdiv khi người dùng nhấp vào liên kết trong .topdiv?

Tôi hiện đang làm cho .bottomdiv xuất hiện thành công khi nhấp bằng mã JQuery bên dưới, nhưng dường như không thể tìm ra cách đặt tiêu điểm vào trường đầu vào cùng một lúc.

$('.link').click(function() {
    $(this).parent().siblings('div.bottom').show();
});

Cảm ơn!

Hãy thử điều này, để đặt tiêu điểm cho trường nhập đầu tiên:

$(this).parent().siblings('div.bottom').find("input.post").focus();

Nếu đầu vào nằm trong hộp thoại phương thức bootstrap, thì câu trả lời sẽ khác. Sao chép từ Cách đặt tiêu điểm thành đầu vào văn bản đầu tiên trong phương thức bootstrap sau khi được hiển thị, đây là những gì được yêu cầu:

$('#myModal').on('shown.bs.modal', function () {
  $('#textareaID').focus();
})  

Câu trả lời của Justin không phù hợp với tôi (Chromium 18, Firefox 43.0.1). jQuery's .focus()tạo điểm nhấn trực quan, nhưng con trỏ văn bản không xuất hiện trong trường (jquery 3.1.0).

Lấy cảm hứng từ https://www.sitepoint.com/jqueryhtml5-input-focus-cursor-positions/ , tôi đã thêm thuộc tính tự động lấy nét vào trường nhập liệu và thì đấy!

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();
}