首页 > 解决方案 > 如何仅针对Angular7中的字母数字和特殊字符触发keydown事件?

问题描述

我有一个 keydown 事件,我希望在按下字母数字或特殊字符(如 #$@)时触发它。

  <input type="text" style="width: 70%;" [(ngModel)]= "textMessage" (keydown) ="sendTypingEvent()" >

我想限制事件根本不被触发,例如 enter、escape (esc)、shift、alt、tab、backspace 和 command (meta)、箭头和 f 键(f1 到 f12)。

有没有办法在 HTML 中设置 REGEX 模式?

<input (keydown.a)="..."> --expect to trigger

我可以触发事件并在函数调用中过滤键,如下所示。但是,尝试查看是否还有其他选择。

sendTypingEvent(event) {
  if (event.key === "Enter" || event.key ==='esc' .... ) {
    console.log("skip this event");
  }

}

标签: javascriptangulartypescript

解决方案


以下是限制 keydown 事件的两种方法 -

  1. 您只允许按字母数字键
sendTypingEvent(event){
        if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 65 && event.keyCode <= 90)){
            console.log("input was 0-9");
            console.log("input was a-z");
            return true;
        }

        return false;
    }
  1. 您可以限制特定键
sendTypingEvent(event){
        if ((event.keyCode >= 112 && event.keyCode <= 123) || event.keyCode == 16){
            console.log("Disabled f11 to f12, shift keys");
            return false
        }
}

获取此网站的密钥代码 -

https://keycode.info/


推荐阅读