当前位置: 首页 > news >正文

全局的键盘监听事件

一、设定全局键盘监听事件 

放在vue 的created()或者mounted ()中,可对整个文档进行键盘事件监听。

new Vue({  created() {  window.addEventListener('keydown', this.handleKeydown);  },  beforeDestroy() {  window.removeEventListener('keydown', this.handleKeydown);  },  methods: {  handleKeydown(e) {  console.log('keydown event triggered', e);  }  }  
}).$mount('#app');

 或者

 // 监听键盘事件document.addEventListener('keydown', function (event) {console.log('按下的键: ', event.key)// 根据不同的键执行不同的操作switch (event.key) {case 'Delete':self.delEl()// 执行 a 键对应的操作breakcase 'Backspace':self.delEl()// 执行 b 键对应的操作break// 其他键...default:break}})

二、特定的div中禁用全局的键盘事件

<template>  <div @keydown.stop>  <!-- 键盘事件将不会冒泡到该div的父元素 -->  </div>  
</template>

关键:@keydown.stop

相关文章:

全局的键盘监听事件

一、设定全局键盘监听事件 放在vue 的created()或者mounted ()中&#xff0c;可对整个文档进行键盘事件监听。 new Vue({ created() { window.addEventListener(keydown, this.handleKeydown); }, beforeDestroy() { window.removeEventListener(keydown, this.handleK…...

Qt自定义QSlider(支持水平垂直)

实现背景&#xff1a; Qt本身有自己的QSlider&#xff0c;为什么我们还要自定义实现呢&#xff0c;因为Qt自带的QSlider存在一个问题&#xff0c;当首尾为圆角时&#xff0c;滑动滚动条到首尾时会出现圆角变成矩形的问题。当然如果QSS之间的margin和滑动条的圆角控制的好的话是…...

会话控制学习

文章目录 介绍cookieexpress中使用cookie获取cookie session配置区别 介绍 cookie express中使用cookie 退出登录就是删除cookie 获取cookie 添加中间键后&#xff0c;直接获取 session 配置 区别...

dweb-browser阅读

dweb-browser阅读 核心模块js.browser.dwebjmm.browser.dwebmwebview.browser.dwebnativeui.browser.dweb.sys.dweb plaoc插件 核心模块 js.browser.dweb 它是一个 javascript-runtime&#xff0c;使用的是 WebWorker 作为底层实现。它可以让您在 dweb-browser 中运行 javasc…...

ChatGPT:使用fastjson读取JSON数据问题——如何使用com.alibaba.fastjson库读取JSON数据的特定字段

ChatGPT&#xff1a;使用fastjson读取JSON数据问题——如何使用com.alibaba.fastjson库读取JSON数据的特定字段 有一段Json字符串&#xff1a; {"code": 200,"message": "success","data": {"total": "1","l…...

2、ARM处理器概论

一、ARM处理器概述 1、ARM的含义 ARM&#xff08;Advanced RISC Machines&#xff09;有三种含义&#xff0c;一个公司的名称、一类处理器的通称、一种技术 ARM公司&#xff1a; 成立于1990年11月&#xff0c;前身为Acorn计算机公司主要设计ARM系列RISC处理器内核授权ARM内…...

【Python】福利彩票复式模拟选号程序

【效果】 【注意】 逻辑是用Random模拟10000次复试彩票选号,然后给出最大可能性一组。但是模拟终究是模拟,和现实彩票结果没有任何联系,下载下来玩就是了,没人能保证模拟出中奖号码,不要投机,不要投机! 【修改】 代码很简单,如果想改成不是复式的,自行修改即可。 如…...

Pytorch 机器学习专业基础知识+神经网络搭建相关知识

文章目录 一、三种学习方式二、机器学习的一些专业术语三、模型相关知识四、常用的保留策略五、数据处理六、解决过拟合与欠拟合七、成功的衡量标准 一、三种学习方式 有监督学习&#xff1a; 1、分类问题 2、回归问题 3、图像分割 4、语音识别 5、语言翻译 无监督学习 1、聚类…...

torch 和paddle 的GPU版本可以放在同一个conda环境下吗

新建conda 虚拟环境&#xff0c;python 版本3.8.17 虚拟机&#xff0c;系统centos 7,内核版本Linux fastknow 3.10.0-1160.92.1.el7.x86_64 &#xff0c;显卡T4&#xff0c;nvidia-smi ,460.32.03&#xff0c;对应cuda 11.2&#xff0c;安装cuda 11.2和cudnn&#xff0c;conda…...

MYBATIS-PLUS入门使用、踩坑记录

转载&#xff1a; mybatis-plus入门使用、踩坑记录 - 灰信网&#xff08;软件开发博客聚合&#xff09; 首先引入MYBATIS-PLUS依赖&#xff1a; SPRING BOOT项目&#xff1a; <dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus…...

C# 静态类和sealed类(密封类)的区别

网上看到很多文章写静态类&#xff0c;和密封类&#xff0c;但是鲜有它们的对比总结&#xff0c;在此简单总结一下&#xff1a; 静态类&#xff08;Static Class&#xff09;&#xff1a; 静态类不能被实例化&#xff0c;其成员都是静态的&#xff0c;可以通过类名直接访问。静…...

el-table如何实现自动缩放,提示隐藏内容

前提问题&#xff1a;大屏展示中某一个区域是表格内容&#xff0c;当放大或缩小网页大小时&#xff0c;表格宽度随之缩放&#xff0c;但表格内容未进行缩放&#xff0c;需要表格内容与网页大小同时进行缩放&#xff0c;且表头和表格内容宽度不够未显示全时&#xff0c;需要进行…...

CRM客户管理软件对出海企业的帮助与好处

2023我们走出了疫情的阴霾&#xff0c;经济下行压力大&#xff0c;面对内需的不足&#xff0c;国内企业纷纷选择出海&#xff0c;拓展海外业务增加企业营收。企业出海不是一件易事&#xff0c;有了CRM系统可以让公司事半功倍&#xff0c;下面就来说一说CRM客户管理软件能为出海…...

【QT--使用百度地图API显示地图并绘制路线】

QT--使用百度地图API显示地图并绘制路线 前言准备工作申请百度地图密钥(AK)安装开发环境 开发过程新建项目ui界面GPSManager类主窗口Map 效果展示 前言 先吐槽一下下&#xff0c;本身qt学的就不咋滴&#xff0c;谁想到第一件事就是让写一个上位机工具&#xff0c;根据CAN总线传…...

C数据结构二.练习题

一.求级数和 2.求最大子序列问题:设给定一个整数序列 ai.az..,a,(可能有负数).设计一个穷举算法,求a 的最大值。例如,对于序列 A {1,-1,1,-1,-1,1,1,1,1.1,-1,-1.1,-1,1,-1},子序列 A[5..9](1,1,1,1,1)具有最大值5 3.设有两个正整数 m 和n,编写一个算法 gcd(m,n),求它们的最大公…...

猫头虎博主第5️⃣期赠书活动:《Java官方编程手册(第12版·Java 17)套装上下册》

&#x1f337;&#x1f341; 博主猫头虎&#xff08;&#x1f405;&#x1f43e;&#xff09;带您 Go to New World✨&#x1f341; &#x1f984; 博客首页——&#x1f405;&#x1f43e;猫头虎的博客&#x1f390; &#x1f433; 《面试题大全专栏》 &#x1f995; 文章图文…...

(1)数据库 MSQ 数据库 安装 使用 以及增删改查

下载官网&#xff1a;MySQL :: Download MySQL Shell 常见的数据库分为&#xff1a; 关系型数据库&#xff0c; Oracle、MySQL、SQLServer、Access非关系型数据库&#xff0c; MongoDB、Redis、Solr、ElasticSearch、Hive、HBase 安装过程 使用过程...

什么测试自动化测试?

什么测试自动化测试&#xff1f; 做测试好几年了&#xff0c;真正学习和实践自动化测试一年&#xff0c;自我感觉这一个年中收获许多。一直想动笔写一篇文章分享自动化测试实践中的一些经验。终于决定花点时间来做这件事儿。 首先理清自动化测试的概念&#xff0c;广义上来讲&a…...

【踩坑篇】代码中使用 Long 作为 Map的Key存在的问题

本周的工作结束&#xff0c;详述一些在项目代码中实际遇到的一些坑。 代码中遇到这样一个场景&#xff1a; 有个业务接口&#xff0c;接口返回的值是一个JSON格式的字符串&#xff0c;通过JSON解析的方式&#xff0c;解析为格式为&#xff1a; Map<Long, Map<String, O…...

微服务保护-授权规则/规则持久化

授权规则 基本规则 授权规则可以对调用方的来源做控制&#xff0c;有白名单和黑名单两种方式。 白名单&#xff1a;来源&#xff08;origin&#xff09;在白名单内的调用者允许访问 黑名单&#xff1a;来源&#xff08;origin&#xff09;在黑名单内的调用者不允许访问 点…...

手游刚开服就被攻击怎么办?如何防御DDoS?

开服初期是手游最脆弱的阶段&#xff0c;极易成为DDoS攻击的目标。一旦遭遇攻击&#xff0c;可能导致服务器瘫痪、玩家流失&#xff0c;甚至造成巨大经济损失。本文为开发者提供一套简洁有效的应急与防御方案&#xff0c;帮助快速应对并构建长期防护体系。 一、遭遇攻击的紧急应…...

【根据当天日期输出明天的日期(需对闰年做判定)。】2022-5-15

缘由根据当天日期输出明天的日期(需对闰年做判定)。日期类型结构体如下&#xff1a; struct data{ int year; int month; int day;};-编程语言-CSDN问答 struct mdata{ int year; int month; int day; }mdata; int 天数(int year, int month) {switch (month){case 1: case 3:…...

在rocky linux 9.5上在线安装 docker

前面是指南&#xff0c;后面是日志 sudo dnf config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo sudo dnf install docker-ce docker-ce-cli containerd.io -y docker version sudo systemctl start docker sudo systemctl status docker …...

vscode(仍待补充)

写于2025 6.9 主包将加入vscode这个更权威的圈子 vscode的基本使用 侧边栏 vscode还能连接ssh&#xff1f; debug时使用的launch文件 1.task.json {"tasks": [{"type": "cppbuild","label": "C/C: gcc.exe 生成活动文件"…...

UDP(Echoserver)

网络命令 Ping 命令 检测网络是否连通 使用方法: ping -c 次数 网址ping -c 3 www.baidu.comnetstat 命令 netstat 是一个用来查看网络状态的重要工具. 语法&#xff1a;netstat [选项] 功能&#xff1a;查看网络状态 常用选项&#xff1a; n 拒绝显示别名&#…...

在 Nginx Stream 层“改写”MQTT ngx_stream_mqtt_filter_module

1、为什么要修改 CONNECT 报文&#xff1f; 多租户隔离&#xff1a;自动为接入设备追加租户前缀&#xff0c;后端按 ClientID 拆分队列。零代码鉴权&#xff1a;将入站用户名替换为 OAuth Access-Token&#xff0c;后端 Broker 统一校验。灰度发布&#xff1a;根据 IP/地理位写…...

srs linux

下载编译运行 git clone https:///ossrs/srs.git ./configure --h265on make 编译完成后即可启动SRS # 启动 ./objs/srs -c conf/srs.conf # 查看日志 tail -n 30 -f ./objs/srs.log 开放端口 默认RTMP接收推流端口是1935&#xff0c;SRS管理页面端口是8080&#xff0c;可…...

Java-41 深入浅出 Spring - 声明式事务的支持 事务配置 XML模式 XML+注解模式

点一下关注吧&#xff01;&#xff01;&#xff01;非常感谢&#xff01;&#xff01;持续更新&#xff01;&#xff01;&#xff01; &#x1f680; AI篇持续更新中&#xff01;&#xff08;长期更新&#xff09; 目前2025年06月05日更新到&#xff1a; AI炼丹日志-28 - Aud…...

解决本地部署 SmolVLM2 大语言模型运行 flash-attn 报错

出现的问题 安装 flash-attn 会一直卡在 build 那一步或者运行报错 解决办法 是因为你安装的 flash-attn 版本没有对应上&#xff0c;所以报错&#xff0c;到 https://github.com/Dao-AILab/flash-attention/releases 下载对应版本&#xff0c;cu、torch、cp 的版本一定要对…...

HTML前端开发:JavaScript 常用事件详解

作为前端开发的核心&#xff0c;JavaScript 事件是用户与网页交互的基础。以下是常见事件的详细说明和用法示例&#xff1a; 1. onclick - 点击事件 当元素被单击时触发&#xff08;左键点击&#xff09; button.onclick function() {alert("按钮被点击了&#xff01;&…...