How to use enter key to focus into next input

Question

when i hit enter key i want it to go to next input, i've seen a code from another question here but my input fields are inside the table, it won't work if my next input is on the next td here's my html code

<form action="#">
<table>
<thead>
    <tr>
    <th>Input 1</th>
    <th>Input 2</th>
    <th>Input 3</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>
            <input name="one"/>        
        </td>
        <td>
            <select name="select">
                <option>asd</option>
                <option>asd</option>
            </select>
           <input name="two"/> 
           <input name="three"/> 
        </td>
        <td>
           <input name="four"/>
        </td>
    </tr>
            <tr>
        <td>
            <input name="field-one"/>        
        </td>
        <td>
            <select name="select">
                <option>asd</option>
                <option>asd</option>
            </select>
           <input name="field-two"/> 
           <input name="field-three"/> 
        </td>
        <td>
           <input name="field-four"/>
        </td>
    </tr>
</tbody>
</table>

http://jsfiddle.net/k2y7evzr/

help me please :) thanks!

score 2 · Accepted Answer · answered Oct 17 '14 at 03:52

How about using index property,

$("input,select").bind("keydown", function(event) {
    if (event.which === 13) {
        alert("asd");
        event.stopPropagation();
        event.preventDefault();
       $(':input:eq(' + ($(':input').index(this) + 1) +')').focus();
    }
});

How to use enter key to focus into next input

1 Answers1

And , Here is the Working Fiddle

Linked