输入键的作用就像制表键在表格上不起作用

Question

我有一个作为选项卡的输入键。 它适用于我的其他文本框，但在我到达表格数据后，它不再起作用。 我的目标是在我按表数据上的“输入”键后，如何将 go 转到下一个文本框？

HTML：

<table class="table table-bordered" border="1" class="classtable" id="applicanttable">
     <tr>
                <th>#</th>
                <th>B#</th>
                <th>W#</th>
                <th>W #</th>
                <th>Action</th>
             </tr>
     
            <tbody class="appendtablee" id="wew">
            </tbody>

脚本：

    //Enter key that acts as a tab key.
    $('input').keypress(function(e){
        if(e.which==13){ 
            $("[tabindex='"+(parseInt($(this).attr("tabindex"))+1)+"']").focus();
            e.preventDefault();
        }
    });   

这个 function 为每个文本框创建一个 tabindex。

$(function() {
    var tabindex = 1;
    $('input,select').each(function() {
        if (this.type != "hidden") {
            var $input = $(this);
            $input.attr("tabindex", tabindex);
            tabindex++;
        }
    });
});

Answer 1

逻辑似乎很好。 唯一的问题似乎是表单提交。

默认情况下，您的输入元素是表单的一部分，在两种情况下表单提交和页面刷新。

1. 当我们点击提交按钮时。
2. 当用户点击 Enter 键时。

如果这是问题，那么您将需要使用

e.preventDefault()

在表单提交事件上。 这将阻止在单击输入时提交表单（但是您需要对代码进行一些调整，因为即使单击提交按钮也会阻止表单提交，在这种情况下您需要检查添加一个额外的查看）。

如下所示：

function submitForm(e) {
   if(e.which===13) {
      e.preventDefault(); // This will prevent the default refresh on click of Enter key
   }

   // Continue with your form submission logic
}