页面监听键盘事件

简介: 页面监听键盘事件

一般是直接加给input框的,经过研究发现:

先写一个方法

const watch = ()=>{
      document.onkeydown = (event)=>{
        if(event.keyCode==27||event.keyCode==192||event.keyCode==17||event.keyCode==18||event.keyCode==91||event.keyCode==16||event.keyCode==13||event.keyCode==37||event.keyCode==38||event.keyCode==39||event.keyCode==40){
          ElMessage({
          type:'error',
          message:'检测到您出现作弊行为,给予警告'
        })
        errorNum.value.push(1)
      }
      if(errorNum.value.length==2){
        over();
        ElMessage({
          type:'error',
          message:'检测到您多次出现作弊行为,已交卷'
        })
        loading.value = true;
        setTimeout(()=>{
          loading.value = false;
        },2000)
      }
      }
    }

onMounted里面

 onMounted(()=>{
        console.log('进入页面')
        allScreen();
        watch();
    })

在这里面调用即可

一进入页面点击被禁用的按键就会被触发

相关文章
|
9月前
|
小程序 UED 开发者
小程序如何监听页面的滚动事件
小程序如何监听页面的滚动事件
306 0
|
小程序
小程序中点击子元素事件而不触发父元素的点击事件
小程序中点击子元素事件而不触发父元素的点击事件
191 0
|
3月前
|
JavaScript 前端开发
除了点击事件,`addEventListener` 还能用于处理哪些事件类型?
【10月更文挑战第29天】 `addEventListener` 能够处理的事件类型非常丰富,涵盖了各种用户交互和页面状态变化的场景,通过合理地使用这些事件类型,可以为网页或应用程序添加丰富多样的交互效果和功能。
|
5月前
|
JSON 小程序 JavaScript
微信小程序页面事件,下拉刷新事件和上拉触底事件
这篇文章介绍了微信小程序中如何实现下拉刷新和上拉触底事件,包括开启下拉刷新、配置下拉刷新样式、监听下拉刷新事件,以及监听上拉触底事件和配置上拉触底的距离。
|
9月前
失焦事件和点击事件
失焦事件和点击事件
55 1
|
9月前
|
JavaScript 前端开发
js基础——事件(鼠标事件、键盘事件、表单事件......)
js基础——事件(鼠标事件、键盘事件、表单事件......)
73 0
|
9月前
页面监听键盘事件
页面监听键盘事件
14、事件类型(鼠标事件、键盘事件、触屏事件)
14、事件类型(鼠标事件、键盘事件、触屏事件)
172 0
|
.NET C# 开发框架
WPF的路由事件、冒泡事件、隧道事件(预览事件)
原文:WPF的路由事件、冒泡事件、隧道事件(预览事件) 本文摘要: 1:什么是路由事件; 2:中断事件路由; 3:自定义路由事件; 4:为什么需要自定义路由事件; 5:什么是冒泡事件和预览事件(隧道事件); 1:什么是路由事件     WPF中的事件为路由事件,所谓路由事件,MSDN定义如下:     功能定义:路由事件是一种可以针对元素树中的多个侦听器(而不是仅针对引发该事件的对象)调用处理程序的事件。
1824 0