我可以使用什么javaScript代码，以使tab键跳过一个tabindex，而角叉车返回键跳过X tabindexes？

Question

我是一名业余编码员和javaScript新手（或更少），并且我正在尝试构建具有多个（许多） <textarea>输入的在线表单。

出于参数缘故，我们假设它是3 x 3的类型方向：

由于其他功能和性能，我必须使用<textarea>而不是<inputs> 。

如果有人按下[TAB]，则不出所料地遵循Tab索引（A1-> B1）。

如果有人按下[RETURN]，因为它是一个<textarea> ，它将添加\\ n分隔符，中断换行并保留在仍集中的<textarea> 。

我想发生的事情是，当一个人按下[RETURN]时，将“跳过”三个制表符索引（如果这是正确的词），并且焦点将移到<textarea>先前聚焦的<textarea>下方的<textarea> <textarea> 。

例如：我在A1； 我写/输入一些东西； 我按[RETURN]； 我直接被带到A2。

[[更新]]

HTML文本区号示例：

<textarea data-id="0" class="inputArea colorInput" id="dataInput_0" name="colorInput_row_1" onFocus="classFocused();" onBlur="classBlured();" onKeyUp="splitInput();"></textarea>

Answer 1

使用jQuery javascript框架，将按键事件监听器附加到您的文本区域，如果按下的键是[ENTER]（按键代码13），则将焦点转移到所需的字段（最好为文本区域设置ID以轻松识别它们） ）。

的HTML

<textarea class="ta" data-id="1"></textarea>
<textarea class="ta" data-id="2"></textarea>
<textarea class="ta" data-id="3"></textarea>

<textarea class="ta" data-id="4"></textarea>
<textarea class="ta" data-id="5"></textarea>
<textarea class="ta" data-id="6"></textarea>

<textarea class="ta" data-id="7"></textarea>
<textarea class="ta" data-id="8"></textarea>
<textarea class="ta" data-id="9"></textarea>

Java脚本

$(document).ready(function(){

    //attach the event listener on your text areas
    $('.ta').keypress(function(e){
        if (e.keyCode == 13) //check if [enter] was pressed
        {
            var currentID = $(this).attr('data-id'); //get the ID of the text area where this happened
            if (currentID < 7) $('.ta[data-id="' + (currentID + 3) + '"]').focus(); //if there are other text areas down the line, shift the focus
        }
    });

})