如何使用tab去某个输入？

Question

目前,当用户按下qty文本框中的选项卡时,它不会选项卡添加到行图像.

我想添加一些jQuery,以便当用户按下qty文本框中的tab键时,它会选中添加图像,用户可以单击Enter.

<td> 
    <input type="text" name="qty" id="qty" maxlength="3" class="txt" style="width: 80px;" />                         
</td>
<td> 
    <input type="image" src="/gfx/btn_addline.jpg" name="Add" value="Add" id="add"/>
</td>

影响数量的Jquery:

 $("#qty").keydown(function (event) {
            //alert(event.keyCode);
            if (event.keyCode == 13) {
                $("#add").click();
                return false;
            }
        });
   $("#qty").keydown(function (event) {
            // Allow only backspace and delete
            if (event.keyCode == 46 || event.keyCode == 8) {
                // let it happen, don't do anything
            }
            else {
                // Ensure that it is a number and stop the keypress
                if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105)) {
                    event.preventDefault();
                }
            }
        });

Answer 1

假设我已正确理解您的问题,您应该只使用tabindex不需要任何JavaScript 的属性:

<input type="text" tabindex="1"> <!--First input-->
<input type="text" tabindex="2"> <!--Press tab, you will end up here-->

更新(见评论)

如果您已经用于tabindex控制页面上其他位置的Tab键顺序,请在此处使用更高的索引.例如,如果索引1-10用于其他元素,请在此处使用11和12:

<input type="text" tabindex="11"> <!--First input-->
<input type="text" tabindex="12"> <!--Press tab, you will end up here-->

更新2(见更新的问题)

您正在阻止Tab键在keydown事件处理程序中执行任何操作.更改为以下内容(添加另一个检查Tab键的条件):

if (event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9) {
    // let it happen, don't do anything
}

这将无需工作tabindex,假设您的两个输入在您的代码中按顺序排列,并且它们之间没有输入.如果有,也使用tabindex.

作为旁注,您应该使用event.which而不是keyCode,因为jQuery使用它来规范化浏览器的不一致性.