javascript - Typescript 键盘监听器阻止在 HTML 输入表单中输入内容

Question

我正在使用 Angular2 开发一个 Web 应用程序，其中一个组件需要监听键盘来检查是否按下了“D”键。这工作正常，只是它阻止我输入 HTML <input>它驻留在另一个组件中。我猜测这是由键盘监听器类中的某些代码引起的，但我不确定在哪里。

这是完整的监听器类:

export class Keyboard {

    private keyboard_d;

    constructor(){
        this.keyboard_d = Keyboard.keyboard(68);
    }

    static keyboard(keyCode){
        var key = {
            code: keyCode,
            isDown: false,
            isUp: true,
            press: undefined,
            release: undefined,
            downHandler: function(event){
                if (event.keyCode === key.code) {
                    if (key.isUp && key.press) key.press();
                    key.isDown = true;
                    key.isUp = false;
                }
                event.preventDefault();
            },
            upHandler: function(event) {
                if (event.keyCode === key.code) {
                    if (key.isDown && key.release) key.release();
                        key.isDown = false;
                        key.isUp = true;
                    }
                    event.preventDefault();
                }
            }

        //Attach event listeners...
        window.addEventListener(
            "keydown", key.downHandler.bind(key), false
        );
        window.addEventListener(
            "keyup", key.upHandler.bind(key), false
        );
        return key;
    }

    //Returns true if the D key is pressed down, false if it is not.
    public isDpressed(){
        return this.keyboard_d.isDown;
    }
}

此类在 Angular2 组件中的使用如下:

var keyboard_listener = new Keyboard(); //create
var dPressed : boolean = keyboard_listener.isDPressed();

这段代码中的什么地方阻止我在 HTML 输入表单中输入内容？

注意，我故意省略了两个相关组件的 Angular 代码，因为如果不需要，我不想添加 angular2 标签，我的直觉表明上面的代码是问题所在。但如果认为有必要，我将编辑帖子并添加 Angular 代码和标签。

Answer 1

调用 event.preventDefault 会停止该事件的默认行为，因此该字符不会显示在输入字段中。