Javascript 按Enter键将焦点移动到下一个控件

我在Angular 1.x上找到了一些项目，用户可以通过按Enter键将焦点移动到下一个控件

'use strict';
app.directive('setTabEnter', function () {

    var includeTags = ['INPUT', 'SELECT'];

    function link(scope, element, attrs) {
        element.on('keydown', function (e) {
            if (e.keyCode == 13 && includeTags.indexOf(e.target.tagName) != -1) {
                var focusable = element[0].querySelectorAll('input,select,button,textarea');
                var currentIndex = Array.prototype.indexOf.call(focusable, e.target)
                var nextIndex = currentIndex == focusable.length - 1 ? 0 : currentIndex + 1;

                if (nextIndex >= 0 && nextIndex < focusable.length)
                    focusable[nextIndex].focus();

                return false;
            }
        });
    }

    return {
        restrict: 'A',
        link: link
    };
});

“严格使用”；
应用程序指令（'SetTabCenter'，函数（）{
var includeTags=['INPUT'，'SELECT']；
功能链接（范围、元素、属性）{
元素on（'keydown'，函数（e）{
if（e.keyCode==13&&includeTags.indexOf（e.target.tagName）！=-1）{
var focusable=element[0]。querySelectorAll（'input，select，button，textarea'）；
var currentIndex=Array.prototype.indexOf.call（可聚焦，e.target）
var nextIndex=currentIndex==focusable.length-1？0:currentIndex+1；
if（nextIndex>=0&&nextIndex

但这对Angular 2不起作用。如何在Angular 2中的Enter键上设置下一个控件的焦点

import { Directive, ElementRef, HostListener, Input } from'@angular/core';
@Directive({
    selector: '[onReturn]'
})
export class OnReturnDirective {
    private el: ElementRef;
    @Input() onReturn: string;
    constructor(private _el: ElementRef) {
        this.el = this._el;
    }
    @HostListener('keydown', ['$event']) onKeyDown(e) {
        if ((e.which == 13 || e.keyCode == 13)) {
            e.preventDefault();
            if (e.srcElement.nextElementSibling) {
                e.srcElement.nextElementSibling.focus();
            }
            else{
                console.log('close keyboard');
            }
            return;
        }

    }

}

---

希望它能帮助你

听起来类似于请共享您的Angular2代码。为此，您在页面上创建单独的指令@tdavMy issue reload focus（）无效。。如果表单上的输入被封装在单独的引导程序“表单行”或上面的“col-…”divs代码中，则自使用.nextElementSibling.any修复程序以来，该代码不起作用？@AkshayKhale您可以尝试此方法。页面上的我的问题重新加载焦点（）不起作用。。它工作完美，正是我所需要的，非常感谢您将在IOS应用程序中工作（e.srcelelement.nextElementSibling.focus（）），我使用过它，但在IOS应用程序中不工作，它在所有浏览器中工作，但在IOS应用程序中不工作。

import { Directive, ElementRef, HostListener, Input, Renderer } from '@angular/core';
@Directive({
    selector: '[onReturn]'
})
export class OnReturnDirective {    
    private el: ElementRef;   
    @Input() onReturn: string;
    constructor(private _el: ElementRef,public renderer: Renderer) {
        this.el = this._el;
    }  
    @HostListener('keydown', ['$event']) onKeyDown(e:any) {
        if ((e.which == 13 || e.keyCode == 13)) {
            e.preventDefault();
            let control:any;
            control = e.srcElement.nextElementSibling;
            while (true){                
                if (control) {
                  if ((!control.hidden) && 
                     (control.nodeName == 'INPUT' || 
                      control.nodeName == 'SELECT' || 
                      control.nodeName == 'BUTTON' || 
                      control.nodeName == 'TEXTAREA'))
                     {
                            control.focus();
                            return;
                        }else{
                            control = control.nextElementSibling;
                        }                         
                }
                else {
                    console.log('close keyboard');
                    return;
                }            
            }
        }
    } 
}