Using jQuery, what's the best way to find the next form element on the page, starting from an arbitrary element? When I say form element I mean <input>
, <select>
, <button>
or <textarea>
.
In the following examples, the element with the id "this" is the arbitrary starting point, and the element with the id "next" is the one I want to find. The same answer should work for all examples.
Example 1:
<ul>
<li><input type="text" /></li>
<li><input id="this" type="text" /></li>
</ul>
<ul>
<li><input id="next" type="text" /></li>
</ul>
<button></button>
Example 2:
<ul>
<li><input id="this" type="text" /></li>
</ul>
<button id="next"></button>
Example 3:
<input id="this" type="text" />
<input id="next" type="text" />
Example 4:
<div>
<input id="this" type="text" />
<input type="hidden" />
<div>
<table>
<tr><td></td><td><input id="next" type="text" /></td></tr>
</table>
</div>
<button></button>
</div>
EDIT: The two answers provided so far both require writing a sequence number to all input elements on the page. As I mentioned in the comments of one of them, this is kind of what I'm already doing and I would much prefer have a read-only solution since this will be happening inside a plugin.
question from:
https://stackoverflow.com/questions/290535/best-way-to-find-next-form-input-element-in-jquery 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…