javascript - 当用户单击链接时，如何聚焦第一个字段并选择其内容？

Question

HTML:

<div class="control-group">
    <label class="control-label" for="some-id-1"><a href="http://example.com/some-id-1" target="_blank">Text1</a></label>
    <div class="controls">
        <input type="text" id="some-id-1" name="some-id-1"><br>
        <input type="text" id="some-id-11" name="some-id-11"><br>
    </div>
</div>
<div class="control-group">
    <label class="control-label" for="some-id-2"><a href="http://example.com/some-id-2" target="_blank">Text2</a></label>
    <div class="controls">
        <input type="text" id="some-id-2" name="some-id-2"><br>
        <input type="text" id="some-id-22" name="some-id-22"><br>
    </div>
</div>

JavaScript:

$(".control-label a").click(function(){
   $(this).parent().next().find('input').focus();
});

DEMO

它选择控件组中的最后一个字段。我该如何选择第一个？

Answer 1

在 find() 方法中使用 :first 选择器:

$(this).parent().next().find('input:first').focus();

JS Fiddle demo .