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

JS 如何处理链接被用户点击中键的操作

今天在开发中遇到一个问题,在使用类似Bootstrap中的Tabs组件时,当在tab导航链接点击中键时会打开一个新的窗口访问链接,于是我尝试在别的普通链接上点击中键时也会如此,我猜测这是浏览器的默认行为。

由于我开发的是一个浏览器在线代码编辑器,我希望的结果是点击中键关闭当前改标签,而不是新窗口打开链接。

既然是浏览器的默认行为,聪明的同学已经想到了事件的 preventDefault 方法。

例如给tab项目的连接添加一个 mousedown 事件,然后判断一下按下的键是哪个,中键就是事件的 button 属性为1,然后调用 preventDefault 方法拦截。一般在绑定的事件的句柄函数中操作。

const handlerClick = (event) => {event.preventDefault();
};

但还有一种更简单的方法,就是现在浏览器新增的一个事件 auxclick,监听一下即可。

在 Vue 中更简单

<template><li class="nav-item"><aclass="nav-link"@auxclick.prevent="() => {}">未命名文件-1</a></li>
</template>

.prevent 为 Vue 中的事件修饰符,作用同上,拦截默认行为。

记录一下

相关文章:

JS 如何处理链接被用户点击中键的操作

今天在开发中遇到一个问题&#xff0c;在使用类似Bootstrap中的Tabs组件时&#xff0c;当在tab导航链接点击中键时会打开一个新的窗口访问链接&#xff0c;于是我尝试在别的普通链接上点击中键时也会如此&#xff0c;我猜测这是浏览器的默认行为。 由于我开发的是一个浏览器在…...

Android 11 使用HAL层的ffmpeg库(1)

1.frameworks/av/media目录下面的修改 From edd6f1374c1f15783d9920ebda22ea915e503775 Mon Sep 17 00:00:00 2001 From: GW00219471 <zhumingxingnoboauto.com> Date: Wed, 17 Jan 2024 15:16:10 0800 Subject: [PATCH] ?UTF-8?q?[V35CUX-4542]:E7A7BBE6A48Dcux20E8…...

友力科技数据中心搬迁方案

将当前运行机房中的所有设备、应用系统安全搬迁至新数据中心机房&#xff0c;实现平滑切换、平稳过渡&#xff0c;最大限度地降低搬迁工作对业务的影响。 为了确保企事业单位能够顺利完成数据中心机房搬迁工作&#xff0c;我们根据实际经验提供了4个基本原则&#xff0c;希望能…...

GitHub敏感信息扫描工具

目录 功能设计 技术实现 程序使用 文件配置 下载地址 功能设计 GitPrey是根据企业关键词进行项目检索以及相应敏感文件和敏感文件内容扫描的工具,其设计思路如下: 根据关键词在GitHub中进行全局代码内容和路径的搜索(in:file,path),将项目结果做项目信息去重整理得到…...

Linux云计算 |【第一阶段】ENGINEER-DAY4

主要内容&#xff1a; 配置Linux网络参数、配置静态主机名、查看/修改/激活/禁用网络连接、指定DNS、虚拟网络连接、虚拟机克隆、SSH客户端、SCP远程复制、SSH无密码验证&#xff08;SERVICE-DAY5&#xff09;、虚拟网络类型 一、网络参数配置 修改网卡配置文件主要是需要配置…...

C++与VLC制作独属于你的动态壁纸背景

文章目录 前言效果展示为什么要做他如何实现他实现步骤获取桌面句柄代码获取桌面句柄libvlc_media_player_set_hwnd函数 动态壁纸代码 总结 前言 在当今的数字世界中&#xff0c;个性化和自定义化的体验越来越受到人们的欢迎。动态壁纸是其中一种很受欢迎的方式&#xff0c;它…...

平凯星辰黄东旭出席 2024 全球数字经济大会 · 开放原子开源数据库生态论坛

7 月 5 日&#xff0c;以“开源生态筑基础&#xff0c;数字经济铸未来”为主题的 2024 全球数字经济大会——开放原子开源数据库生态论坛在北京成功举办。平凯星辰&#xff08;北京&#xff09;科技有限公司联合创始人黄东旭发表了题为《TiDB 助力金融行业关键业务系统实践》的…...

Mac OS 下安装 NVM,1秒教会你

1.下载 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash或者wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash 2.安装成功后执行 nvm 提示 command not found 首先查看 ~/.bash_profile 文件是否存在&…...

搭建博客系统#Golang

WANLI 博客系统 项目介绍 基于vue3和gin框架开发的前后端分离个人博客系统&#xff0c;包含md格式的文本编辑展示&#xff0c;点赞评论收藏&#xff0c;新闻热点&#xff0c;匿名聊天室&#xff0c;文章搜索等功能。 点击跳转&#xff1a;Github 项目开源地址 功能展示 B 站…...

算法——滑动窗口(day6)

1004.最大连续1的个数 ||| 1004. 最大连续1的个数 III - 力扣&#xff08;LeetCode&#xff09; 题目解析&#xff1a; 这道题如果能转化为滑动窗口的话就会很简单&#xff0c;因为我们如果尝试去把0翻转为1再计数的话等到第2轮又得重新翻转回来&#xff0c;费时费力~ 那么我…...

推荐一款基于Spring Boot 框架开发的分布式文件管理系统,功能齐全,非常便捷(带私活源码)

前言 在数字化时代&#xff0c;文件管理是企业和个人用户的基本需求。然而&#xff0c;现有的文件管理系统往往存在一些痛点&#xff0c;如存储空间有限、文件共享困难、缺乏在线编辑功能、移动端适配性差等。这些问题限制了用户在不同设备和场景下的文件处理能力。 为了解决…...

Mysql-查询

1.基本查询 //查询所有内容 select * from 表名;//查询指定字段 select 字段1&#xff0c;字段2&#xff0c;字段3.....from 表名;//查询时给字段起别名 select 字段1 as 别名1 , 字段2 as 别名2 ... from 表名&#xff1b;//去重查询 select distinct 字段列表 from 表名; …...

广东科学技术职业学院计算机学院领导一行莅临泰迪智能科技参观交流

7月17日&#xff0c;广东科学技术职业学院计算机学院副院长张军、计算机学院副书记吴国庆、计算机学院大数据教学部部长谢文达、科技与校企合作部副部长黄相杰、科技与校企合作部副部长吴胜兵莅临广东泰迪智能科技股份有限公司产教融合实训基地参观交流&#xff0c;泰迪智能科技…...

exo 大模型算力共享;Llama3-70B是什么

目录 exo 大模型算力共享 exo框架的特点 如何使用exo框架 注意事项 结论 Llama3-70B是什么 一、基本信息 二、技术特点 三、性能与应用 四、未来发展 exo 大模型算力共享 exo框架的特点 异构支持:支持多种不同类型的设备,包括智能手机、平板电脑、笔记本电脑以及高…...

测试——Junit

内容大纲: 常用的五个注解 测试用例顺序指定 参数化 测试套件 断言 1. 常用的五个注解 1.1 Test 通常情况下,我们输入要写在main方法下,此时我想直接输出: Test void Test01(){System.out.println("第一个测试用例"); } 1.2 BeforeAll AfterAll BeforeALL在Tes…...

BUG ImportError: cannot import name ‘QAction‘ from ‘PySide6.QtWidgets‘

BUG ImportError: cannot import name ‘QAction’ from ‘PySide6.QtWidgets’ 环境 PySide6 6.7.2详情 在参考 PyQt5 的代码写 Pyside6 的右键菜单时遇到的错误。 错误代码 from PySide6.QtWidgets import QAction错误原因&#xff1a; 在PySdie6中&#xf…...

对某次应急响应中webshell的分析

文章前言 在之前处理一起应急事件时发现攻击者在WEB应用目录下上传了webshell&#xff0c;但是webshell似乎使用了某种加密混淆手法&#xff0c;无法直观的看到其中的木马连接密码&#xff0c;而客户非要让我们连接webshell来证实此文件为后门文件且可执行和利用(也是很恼火&a…...

Vue3新特性

Vue3新特性 1、Composition API1.1 什么是 Composition API1.2 常用 Composition API1.2.1 setup1.2.2 ref1.2.3 reactive1.2.4 computed1.2.5 watchEffect、watchPostEffect、watchSyncEffect1.2.6 watch 2、生命周期2.1 Vue3生命周期钩子2.2 vue2 和 vue3 关于生命周期的对比…...

一套功能齐全、二开友好的即时通讯IM工具,提供能力库和UI库,支持单聊、频道和机器人(附源码)

前言 在当今数字化时代&#xff0c;即时通讯(IM)和实时音视频(RTC)功能已成为众多应用的标配。然而&#xff0c;现有的解-决方案往往存在一些痛点&#xff0c;如架构落后、成本高昂、数据安全性和隐私保护不足&#xff0c;以及二次开发和部署的复杂性。 为了解决这些问题&…...

MySQL:JOIN 多表查询

多表查询 在关系型数据库中&#xff0c;表与表之间是有联系的&#xff0c;它们通过 外键 联系在一起&#xff0c;所以在实际应用中&#xff0c;经常使用多表查询。多表查询就是同时查询两个或两个以上的表。 MySQL多表查询是数据库操作中非常重要的一部分&#xff0c;它允许你…...

生成xcframework

打包 XCFramework 的方法 XCFramework 是苹果推出的一种多平台二进制分发格式&#xff0c;可以包含多个架构和平台的代码。打包 XCFramework 通常用于分发库或框架。 使用 Xcode 命令行工具打包 通过 xcodebuild 命令可以打包 XCFramework。确保项目已经配置好需要支持的平台…...

【杂谈】-递归进化:人工智能的自我改进与监管挑战

递归进化&#xff1a;人工智能的自我改进与监管挑战 文章目录 递归进化&#xff1a;人工智能的自我改进与监管挑战1、自我改进型人工智能的崛起2、人工智能如何挑战人类监管&#xff1f;3、确保人工智能受控的策略4、人类在人工智能发展中的角色5、平衡自主性与控制力6、总结与…...

Prompt Tuning、P-Tuning、Prefix Tuning的区别

一、Prompt Tuning、P-Tuning、Prefix Tuning的区别 1. Prompt Tuning(提示调优) 核心思想:固定预训练模型参数,仅学习额外的连续提示向量(通常是嵌入层的一部分)。实现方式:在输入文本前添加可训练的连续向量(软提示),模型只更新这些提示参数。优势:参数量少(仅提…...

高频面试之3Zookeeper

高频面试之3Zookeeper 文章目录 高频面试之3Zookeeper3.1 常用命令3.2 选举机制3.3 Zookeeper符合法则中哪两个&#xff1f;3.4 Zookeeper脑裂3.5 Zookeeper用来干嘛了 3.1 常用命令 ls、get、create、delete、deleteall3.2 选举机制 半数机制&#xff08;过半机制&#xff0…...

Leetcode 3577. Count the Number of Computer Unlocking Permutations

Leetcode 3577. Count the Number of Computer Unlocking Permutations 1. 解题思路2. 代码实现 题目链接&#xff1a;3577. Count the Number of Computer Unlocking Permutations 1. 解题思路 这一题其实就是一个脑筋急转弯&#xff0c;要想要能够将所有的电脑解锁&#x…...

DBAPI如何优雅的获取单条数据

API如何优雅的获取单条数据 案例一 对于查询类API&#xff0c;查询的是单条数据&#xff0c;比如根据主键ID查询用户信息&#xff0c;sql如下&#xff1a; select id, name, age from user where id #{id}API默认返回的数据格式是多条的&#xff0c;如下&#xff1a; {&qu…...

土地利用/土地覆盖遥感解译与基于CLUE模型未来变化情景预测;从基础到高级,涵盖ArcGIS数据处理、ENVI遥感解译与CLUE模型情景模拟等

&#x1f50d; 土地利用/土地覆盖数据是生态、环境和气象等诸多领域模型的关键输入参数。通过遥感影像解译技术&#xff0c;可以精准获取历史或当前任何一个区域的土地利用/土地覆盖情况。这些数据不仅能够用于评估区域生态环境的变化趋势&#xff0c;还能有效评价重大生态工程…...

实现弹窗随键盘上移居中

实现弹窗随键盘上移的核心思路 在Android中&#xff0c;可以通过监听键盘的显示和隐藏事件&#xff0c;动态调整弹窗的位置。关键点在于获取键盘高度&#xff0c;并计算剩余屏幕空间以重新定位弹窗。 // 在Activity或Fragment中设置键盘监听 val rootView findViewById<V…...

tree 树组件大数据卡顿问题优化

问题背景 项目中有用到树组件用来做文件目录&#xff0c;但是由于这个树组件的节点越来越多&#xff0c;导致页面在滚动这个树组件的时候浏览器就很容易卡死。这种问题基本上都是因为dom节点太多&#xff0c;导致的浏览器卡顿&#xff0c;这里很明显就需要用到虚拟列表的技术&…...

关键领域软件测试的突围之路:如何破解安全与效率的平衡难题

在数字化浪潮席卷全球的今天&#xff0c;软件系统已成为国家关键领域的核心战斗力。不同于普通商业软件&#xff0c;这些承载着国家安全使命的软件系统面临着前所未有的质量挑战——如何在确保绝对安全的前提下&#xff0c;实现高效测试与快速迭代&#xff1f;这一命题正考验着…...