·设为首页收藏本站📧邮箱修改🎁免费下载专区🔐设置/修改密码👽群雄群聊
🔄最新发布📃文档资料库🆔加群看共享切换到窄版
立即注册
DZ插件网»🏠首页 › Discuz!交流与探讨 › Discuz!运营教程 › 开发文档 › vue 实现页面监听键盘按键 上下左右
返回列表 发布新帖

vue 实现页面监听键盘按键 上下左右

160 0
发表于 2022-3-4 16:02:53 | 显示全部楼层 阅读模式

马上注册，免费下载更多dz插件网资源。

您需要 登录 才可以下载或查看，没有账号？立即注册

×
其实这个就算是快捷键的操作了，单纯的按下一个按键监听，目前也稍微简单一点。

在 mounted 钩子函数里面调用一个方法，让页面监听键盘事件。

[JavaScript]  
  1. this.keyDown()
复制代码


然后接下来的工作就是监听。

[JavaScript]  
  1. // 监听键盘
  2.       keyDown() {
  3.         document.onkeydown =  (e) => {
  4.           //事件对象兼容
  5.           let e1 = e || event || window.event || arguments.callee.caller.arguments[0]
  6.           //键盘按键判断:左箭头-37;上箭头-38；右箭头-39;下箭头-40
  7.           //左
  8.           if (e1 && e1.keyCode == 37) {
  9.             // 按下左箭头
  10.           } else if (e1 && e1.keyCode == 39) {
  11.             // 按下右箭头
  12.           }
  13.         }
  14.       },
复制代码
实现, 页面, 监听, 键盘, 按键
我要说一句 收起回复
赞赏
回复

使用道具 举报

相关帖子
返回列表 发布新帖

回复
 懒得打字嘛，点击右侧快捷回复【查看最新发布】   【应用商城享更多资源】
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关于我们

关于我们 免责声明 应用市场 下载中心

服务支持

有问必答 优秀站点 常见问题 建站必看
投诉/建议联系

discuzaddons@vip.qq.com

未经授权禁止转载，复制和建立镜像，
如有违反，按照公告处理!!!
  • 联系QQ客服
  • 添加微信客服

联系DZ插件网微信客服|最近更新|Archiver|手机版|小黑屋|DZ插件网! ( 鄂ICP备20010621号-1 )|网站地图

您的IP:3.19.211.134,124.238.241.55,GMT+8, 2024-4-29 09:03 , Processed in 0.169532 second(s), 68 queries , Gzip On, Redis On.

Based on Discuz! W1.0 Licensed

© 2001-2024 Discuz! Team.

关灯 在本版发帖
扫一扫添加微信客服
 QQ客服返回顶部
快速回复 返回顶部 返回列表