Jquery .next（输入或文本区域）

Posted 2023-02-25

【中文标题】Jquery .next（输入或文本区域）

【英文标题】：Jquery .next(input OR textarea)

【发布时间】：2011-10-08 21:31:50

【问题描述】：

我在搞乱这行简单的代码：

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

我想让它选择下一个(input OR textarea)，以先到者为准 - 我该怎么做？

作为替代方案，我怎样才能让它只关注tabindex 中的下一项？

编辑

因为下一个 input/tabindex 并不总是在 $(this) 之后，我怎样才能轻松地遍历兄弟列表直到找到下一个匹配项？

【参考方案1】：

使用:input 选择所有输入、文本区域、选择和按钮元素。

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

jsFiddle

如果下一个输入不是同级输入，这似乎可行... 对于此示例，单击带有id="test" 的文本框，它将在下一个:input 元素上显示focus。

<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

【讨论】：

.nextAll(':input:first') 引发异常，但 .nextAll('input:first') 似乎有效。

它确实不会抛出异常，看看我的工作 examples。你做错了什么。

【参考方案2】：

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

但只有当下一个输入/文本区域是紧跟在this 之后的兄弟时，它才会起作用。

或者，您可以在 jQuery UI 中use the :focusable selector。

Sample fiddle - 按回车键聚焦下一个输入

如果当前没有选择输入，您也可以通过绑定到 document 本身并使用 e.target 来选择 target the first input。