简体   繁体   中英

How to focus on next row input in the same column by hitting enter key

I am saving Paper result I want to save it fast like we do in ms excel by pressing enter key do focus on next bottom cell

<tr>
    <td>1</td>
    <td>Muhammad Umar Abdur Rahman</td>
    <td>
        <input type="text" value="0" name="ReadingMarks257" onkeydown="Next(event)" class="input">
    </td>
    <td>
        <input type="text" value="0" name="WritingMarks257" onkeydown="Next(event)" class="input">
    </td>
    <td>
        <input type="text" value="0" name="PaperMarks257" onkeydown="Next(event)" class="input">
</tr>
<tr>
    <td>2</td>
    <td>Muhammad Abu Bakkar</td>
    <td>
        <input type="text" value="0" name="ReadingMarks258" onkeydown="Next(event)" class="input">
    </td>
    <td>
        <input type="text" value="0" name="WritingMarks258" onkeydown="Next(event)" class="input">
    </td>
    <td>
        <input type="text" value="0" name="PaperMarks258" onkeydown="Next(event)" class="input">
    </td>
</tr>

I have already tried

function Next(e) {
    if (e.which === 13) {
        var Element = $(this).closest('tr').next().find('.input');
        Element.focus();
    } else {
        $("#Msg").html('another Pressed');
    }
}

You can use nextElementSibling.focus() :

function Next(e) { 
    if (e.which === 13) {
        e.target.nextElementSibling.focus();
    }
    else {
        $("#Msg").html('another Pressed');
    }
}

Hey @NibrasAffairs use :first selector.

 $('.input').keydown(function (e) { if (e.which === 13) { $(this).closest('tr').next().find('input[type=text]:first').focus(); } });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script> <table class="half"> <tr> <td>2</td> <td>Muhammad Abu Bakkar</td> <td><input type="text" value="0" name="ReadingMarks258" class="input"></td> <td><input type="text" value="0" name="WritingMarks258" class="input"></td> <td><input type="text" value="0" name="PaperMarks258" class="input"></td> </tr> <tr> <td>2</td> <td>Muhammad Abu Bakkar</td> <td><input type="text" value="0" name="ReadingMarks258" class="input"></td> <td><input type="text" value="0" name="WritingMarks258" class="input"></td> <td><input type="text" value="0" name="PaperMarks258" class="input"></td> </tr> <tr> <td>2</td> <td>Muhammad Abu Bakkar</td> <td><input type="text" value="0" name="ReadingMarks258" class="input"></td> <td><input type="text" value="0" name="WritingMarks258" class="input"></td> <td><input type="text" value="0" name="PaperMarks258" class="input"></td> </tr> </table>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM