如何用 TypeScript 代码区分一个 button 动作是由键盘还是鼠标触发的

如下图所示:这个 icon,既可以直接通过鼠标点击,又可以通过键盘 tab 键将 focus 移至其上,然后敲键盘回车键完成点击。

如何用 TypeScript 代码区分一个 button 动作是由键盘还是鼠标触发的如何用 TypeScript 代码区分一个 button 动作是由键盘还是鼠标触发的

在代码里,如何判断这两种情形?


如何用 TypeScript 代码区分一个 button 动作是由键盘还是鼠标触发的

通过 @HostListener 监听指令宿主元素即 button 元素的 keydown.enter 和 keydown.space 事件。如果发生,说明键盘被按下来了。

这里的事件类型为 KeyboardEvent.如何用 TypeScript 代码区分一个 button 动作是由键盘还是鼠标触发的

keydown.tab 和 keydown.shift.tab 说明 tab 键被按下。

如何用 TypeScript 代码区分一个 button 动作是由键盘还是鼠标触发的


如果是鼠标点击,事件名称为 click,对应的事件对象类型为 MouseEvent.

如何用 TypeScript 代码区分一个 button 动作是由键盘还是鼠标触发的

上一篇:手机即钥匙 阿里云IoT联合爱玛推出“真无感解锁”智能电动车


下一篇:物联网将促进企业安全标准形成 并拉近消费者