Multiple key binding on (keydown) event in angular 6

这一生的挚爱 提交于 2021-02-08 06:12:30

问题


I have used (keydown) event in angular 6 to bind key inputs

So on enter of 'Tab' and 'Enter' key i have to do my functionality and added a event.prevent default

But when Shift + Tab is entered it is also preventing the event

.html

<input type="text" [(ngModel)]="Result1 (keydown)="onKeydownMain($event)"  >

I dont want (keydown.shift.tab) event seperate..

.ts

public onKeydownMain(event): void {
    if (event.key === "Enter" || event.key === "Tab") {
                event.preventDefault();
                   // My Functionality goes here
    }
}

But the problem is when Shift + Tab is pressed , event is fired and functionality goes on, which i don't want.

How can i go this

I just want Shift + Tab to perform its default functionality on this input.


回答1:


You need to remove the shift in the if condition like this:

public onKeydownMain(event): void {
       if (!event.shiftKey && (event.key === "Enter" || event.key === "Tab")){
                event.preventDefault();
                   // My Functionality goes here
        }
    }

You can refer to https://www.w3schools.com/jsref/obj_keyboardevent.asp for KeyboardEvent




回答2:


Try avoiding the shift keyevent value 16 in your code. event.which is used to display the keyevent value.

alert(event.which);
event.preventDefault();
if (event.keyCode!=16 && (event.keyCode === 13 || event.keyCode === 9 )) {
    alert("Pressed enter");
}


来源:https://stackoverflow.com/questions/52665812/multiple-key-binding-on-keydown-event-in-angular-6

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!