Javascript 使用向下箭头键（与tab键一样）聚焦下一个输入

我有一个巨大的输入表单和字段供用户输入

在用户使用tab键移动到下一个字段的表单中，有一些隐藏字段和只读文本框，在这些字段和文本框之间使用javascript禁用tab键

现在用户发现很难使用tab键，并希望在键盘的向下箭头键上具有相同的功能

我正在使用下面的代码调用js上的tab键代码，但不起作用，请一些人帮我解决这个问题

function handleKeyDownEvent(eventRef)
{ 
 var charCode = (window.event) ? eventRef.keyCode : eventRef.which;

 //alert(charCode);

 // Arrow keys (37:left, 38:up, 39:right, 40:down)...
 if (  (charCode == 40) )
 {

  if ( window.event )
   window.event.keyCode = 9;
  else
   event.which = 9;

  return false;
 }

 return true;
}

<input type="text"   onkeydown=" return  handleKeyDownEvent(event);" >

函数handleKeyDownEvent（eventRef）
{ 
var charCode=（window.event）？eventRef.keyCode:eventRef.which；
//警报（字符码）；
//箭头键（37:左，38:上，39:右，40:下）。。。
如果（（字符代码==40））
{
if（window.event）
window.event.keyCode=9；
其他的
event.which=9；
返回false；
}
返回true；
}

使用，您可以执行以下操作：

$('input, select').keydown(function(e) {
    if (e.keyCode==40) {
        $(this).next('input, select').focus();
    }
});

按下向下箭头键（键代码40）时，下一个输入接收焦点

​

编辑：

在Vanilla JS中，可以这样做：

function doThing(inputs) {    
    for (var i=0; i<inputs.length; i++) {
        inputs[i].onkeydown = function(e) {
            if (e.keyCode==40) {
                var node = this.nextSibling;
                while (node) {
                    console.log(node.tagName);
                    if (node.tagName=='INPUT' || node.tagName=='SELECT') {
                        node.focus();
                        break;
                    }
                    node = node.nextSibling;                
                }
            }
        };
    };
}
doThing(document.getElementsByTagName('input'));
doThing(document.getElementsByTagName('select'));

函数点（输入）{
对于（var i=0；i如果我理解正确，某些字段是只读的，因此tab键仍然会激活它们，即使它们是只读的，这很烦人，因为您可能需要多次按tab键才能进入下一个可编辑字段。如果这是正确的，那么另一种解决方案是使用
tabindex
属性o在您的输入字段中，为每个字段编制索引，以便不选择只读字段和其他不可编辑字段。您可以在tabindex属性中找到更多信息。
这是我的最终工作代码：

$('input[type="text"],textarea').keydown( function(e) {
    var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;

    if(key == 40) {
        e.preventDefault();
        var inputs = $(this).parents('form').find(':input[type="text"]:enabled:visible:not("disabled"),textarea');

        inputs.eq( inputs.index(this)+ 1 ).focus();
        inputs.eq( inputs.index(this)+ 1 ).click();
    }
});

可能重复@Neal+1的人太多了，我有点太习惯用巧克力写Javascript了。如果需要移植到vanilla js，nextSibling是一个不错的选择。@Neal但你仍然想过滤输入，这不能用nextSibling完成，所以你必须循环：（所以循环@dystroy！这就是
。next（）
无论如何都可以！我将它移植到vanilla js中。只是因为我们必须让我们的头脑能够做到这一点。但这更乏味，即使它可能更短。@dystroy，你会如何处理它js@strout，我可以为只读字段禁用tabindex，我需要在向下箭头键上实现tab键功能..谢谢我只是缺少：不是（“只读”）.不过这是一种魅力，谢谢你。