jquery - Jquery .next(入力またはテキストエリア)

Question

私はこの単純なコード行をいじっています:

$(this).next('input').focus();

(input OR textarea)次の を最初に選択するようにしたいのですが、どうすればよいですか?

別の方法として、次のアイテムに焦点を合わせるにはどうすればよいtabindexですか?

編集

次の input/tabindex は常に の直後にあるとは限らない$(this)ため、次の一致が見つかるまで兄弟のリストを簡単にたどるにはどうすればよいですか?

Answer 1

:inputすべてのinput、textarea、select、およびbutton要素を選択する which を使用します。

$(this).next(':input').focus();

jsフィドル

次の入力が兄弟でない場合、これはうまくいくようです... この例では、テキストボックス内で をクリックするid="test"とfocus、次の:input要素になります。

<input type="text" value="hello world2"/>
<input type="text" value="hello world3"/>
<div>
    <input type="text" id="test"/>
</div>
<div>
    <div>Hi</div>
</div>
<textarea>found me</textarea>
<input type="text" value="hello world"/>

$(document).ready(function(){
    $('#test').click(function(){
       var c = $(this).parents().nextAll(':input:first').focus();
    });
});

jsFiddle2

Answer 2

$(this).next('input,textarea').focus();

ただし、次の入力/テキストエリアが の直後の兄弟である場合にのみ機能しますthis。

または、 jQuery UI からセレクターを使用する:focusableこともできます。

サンプル フィドル- Enter キーを押して次の入力にフォーカスします

入力が現在選択されていない場合は、それ自体にバインドしてを使用することにより、最初の入力をターゲットにすることもできます。documente.target