数据结构
网络
关系型数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法学研究如何使用JavaScript检测复制粘贴命令Ctrl+V、Ctrl+C？
本文将教你如何使用JavaScript检测Ctrl+V按键。当用户希望将内容粘贴到输入字段时，他们有两种选择：使用右键菜单或同时按下CTRL和V键。
keydown事件的ctrl属性用于确定包含“Ctrl”的按键组合。它产生一个“布尔”值，用于识别在触发按键事件期间是否按下“ctrl”。
语法
event.ctrlKey
返回值
true − 按下“ctrl”键后。
false − 如果“ctrl”键未按下。
示例1
HTML源代码 − 下面显示了用于检测“Ctrl+C”和“Ctrl+V”组合的“index.html”文件代码。
<!DOCTYPE html>
<html>
<title>How to detect copy paste commands Ctrl+V, Ctrl+C using JavaScript - TutorialsPoint</title>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
</head>
<body style="text-align:center">
<div class="container">
<textarea placeholder="Enter Text Here" cols="40" row="4"></textarea>
<textarea placeholder="Paste Text Here" cols="40" row="4"></textarea>
</div>
<div id="result1"></div>
<div id="result2"></div>
</body>
</html>
CSS源代码 − 下面显示了上述HTML文件中使用的“style.css”文件代码。
.container{
display: flex;
flex-direction: column;
align-items: center;
}
textarea{
margin-top: 40px;
}
JavaScript代码 − 下面显示了上述HTML文件中使用的“script.js”文件代码。
document.body.addEventListener("keydown", function (myEvent) {
// function that verifies the detection
myEvent = myEvent || window.event; // 'myEvent' is event object
let key = myEvent.which || myEvent.keyCode; // this is to detect keyCode
// Detecting Ctrl
let ctrl = myEvent.ctrlKey ? myEvent.ctrlKey : ((key === 17) ? true : false);
// if the key being pushed is V and ctrl is true.
if (key == 86 && ctrl) {
// print in result
document.getElementById("result1").innerHTML =("Ctrl+V is pressed.");
}
else if (key == 67 && ctrl) {
// if the key being pushed is C and the true value of ctrl
// print in result
document.getElementById("result2").innerHTML =("Ctrl+C is pressed.");
}
}, false);
输出
上述代码将给出以下输出：
按下Ctrl+C后，您将看到打印出所需的消息，如下所示。
接下来，按下Ctrl+V后，您将看到打印出所需的消息，如下所示。
示例2
KeyboardEvent对象定义了用户与键盘的交互；每个事件都指示用户与键盘上的一个键或一个键与修饰键的组合之间的特定关系。事件类型（keydown、keypress或keyup）指示发生了什么类型的键盘活动。
<!DOCTYPE html>
<html>
<title>How to detect copy paste commands Ctrl+V, Ctrl+C using JavaScript - TutorialsPoint</title>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body style="text-align:center">
<h4>You will see a detected result with an alert box when you press the keyboard shortcut Ctrl+C.
</h4>
<h4>You will see a detected result with an alert box when you press the keyboard shortcut Ctrl+V.
</h4>
<script>
document.addEventListener('keydown', evt => {
if (evt.key === 'c' && evt.ctrlKey) {
alert('You have been detected, you have pressed Ctrl+C');
} else if (evt.key === 'v' && evt.ctrlKey) {
alert('You have been detected, you have pressed Ctrl+V');
}
});
</script>
</body>
</html>
在按下任何快捷键之前，您将看到此屏幕。
接下来，在按下键盘上的Ctrl+C快捷键后，您将看到此屏幕。
此外，在按下键盘上的Ctrl+V快捷键后，您将看到此屏幕。
简而言之
每个程序员和系统管理员都知道Ctrl+C和Ctrl+V快捷键的价值，这是一个内置于每个操作系统环境核心的基本且通用的组合。
您可以通过使用JavaScript EventListener在命令内放置CSS层来隐藏有效载荷，从而在复制文本时修改复制的文本。上述代码或示例使用keydown事件，此事件恰好在按下Ctrl+C快捷键时触发。执行此操作的execCommand("copy")命令需要一个触发器，也称为“事件”来运行。延迟0.8秒后，剪贴板中的文本将被代码替换。
4K+ 浏览量
