如何检测TypeScript中按下的键?

时间:2014-06-08 16:22:34

标签: javascript knockout.js typescript

在javascript

中以下行的typescript中语义等效的语法是什么
//Some knockout event handler.
myFunc(data : string, evt : Event) {
    //If enter or tab key up were detected add the excuse to the collection.
    if(evt.enterKey || evt.which == 9)
        //Do Something
}

我遇到的麻烦与普通的javascript事件不同,typescript事件类没有属性enterKeywhich。那么如何在不获取打字稿编译错误和丑陋的红色摇摆下划线的情况下检测哪个键被按下?

3 个答案:

答案 0 :(得分:21)

您需要使用更专业的事件类型KeyboardEvent,如下所示:

myFunc(data : string, evt : KeyboardEvent)

如果你想删除evt.enterKey的错误,你需要通过扩展接口来添加它 - 虽然我不知道这是一个真正的属性,因为它不是技术的控制键,比如CTRLSHIFTALT,它们都具有该事件的属性:

interface KeyboardEvent {
    enterKey: boolean;
}

答案 1 :(得分:3)

您需要注册活动,例如:

class EventHandler {
    static RegisterKeyPress(input: string){
        document.getElementById(input).addListener('keypress', (e: KeyboardEvent) =>{
           //You have yout key code here
            console.log(e.keyCode);
        }
    }
}

快乐的编码!

答案 2 :(得分:0)

对于React用户

  private onKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {
    console.log(e.key)
  }

其中HTMLDivElement是附加元素onKeyDown的类型。