如何在JavaScript中检测复制和粘贴？

Question

我的表单中有两个字段，一个是emailid，另一个是password。我希望防止用户粘贴到这些字段中。他们应该被强制手动输入，就像Google表单一样。

- StaticVariable

---

如果有人想复制粘贴，那是他们的决定，不是你的。防止默认操作系统/浏览器行为永远都不是可接受的解决方案。 - Christian

这已经做过了，但这是个不好的主意，特别是在处理电子邮件和其他纯文本时：相较于偶尔输错电子邮件地址，它更加不方便。 - jpaugh

但我想给我的表单添加一些更多的功能，这种复制可能会在密码的情况下给用户带来问题。 - StaticVariable

可能重复？https://dev59.com/uXM_5IYBdhLWcg3wymY0 - James Manning

如果您正在添加自定义功能并且复制/粘贴可能会导致问题，那就是您的问题，而不是用户的问题。永远不要通过使用户处于不利地位来解决自己的问题。 - Christian

Answer 1

2020更新

可以使用copy和paste事件来防止这些操作，或者修改被复制或粘贴的数据。 （有关浏览器支持，请参见链接）

<input type="text" onpaste="return false">

或使用更长的JavaScript版本：

const elem = document.getElementById('nopaste');

elem.addEventListener('paste', (event) => {
  event.preventDefault();
});

<input type="text" placeholder="can paste"><br>
<input type="text" id="nopaste" placeholder="can not paste">

- potato

Answer 2

您可以禁用ctrl+v组合键和右键单击。

对于IE浏览器，您可以使用以下事件处理程序：

onpaste="return false;" 
oncut="return false;" 
oncontextmenu="return false;" 
oncopy="return false;".

这是一个适用于所有浏览器的解决方法：

function noCTRL(e) {
      var code = (document.all) ? event.keyCode : e.which;
      var ctrl = (document.all) ? event.ctrlKey : e.modifiers & Event.CONTROL_MASK;
      var msg = "Sorry, this functionality is disabled.";
      if (document.all) {
        if (ctrl && code == 86) {
          //CTRL+V
          alert(msg);
          window.event.returnValue = false;
        } else if (ctrl && code == 67) { 
         //CTRL+C (Copy)
          alert(msg);
          window.event.returnValue = false;
        }
      } else {
        if (ctrl == 2) {
          //CTRL key
          alert(msg);
          return false;
        }
      }
    }

在HTML部分，您的字段将如下所示：

Email :<input name="email" type="text" value=""/><br/>
Password :<input name="password" type="password" value=""/><br/>
Confirm Email :<input name="email" type="text" value="" onkeydown="return noCTRL(event)"/>    
Confirm Password :<input name="password" type="password" value="" onkeydown="return noCTRL(event)"/>

如果输入类型为password，我认为用户无法复制密码字段。

希望这可以帮到你。

注意：

1. 在浏览器中禁用JavaScript将允许用户做任何他们想做的事情。
2. 永远记住：尊重用户的自由。

- Alfred

---

你可以禁用它们。我不会说一个人应该禁用它们。 - DA.

在我的OSX上这个不起作用。例如，ctrl键绑定到'91'。如果您可以访问类似于'jquery'的库，请查看此帖子：https://dev59.com/-3RB5IYBdhLWcg3wN08P - TOBlender

@blasteralfredΨ 是的，我知道，但这是在处理JavaScript粘贴时的第一个搜索结果，只是为人们提供另一种解决方案的途径。 - TOBlender

@SuperUberDuper，让我来看看。 - Alfred

Answer 3

你应该使用onpaste。当用户尝试粘贴文本时，会触发粘贴事件。

HTML

<h3>Play with this text area:</h3>
<textarea id="editor" rows="3">Try copying and pasting text into this field!</textarea>

<h3>Log:</h3>
<p id="log"></p>

JavaScript

function logCopy(event) {
  log.innerText = 'Copied!\n' + log.innerText;
}

function logPaste(event) {
  log.innerText = 'Pasted!\n' + log.innerText;
}

const editor = document.getElementById('editor');
const log = document.getElementById('log');

editor.oncopy = logCopy;
editor.onpaste = logPaste;

- MD SHAYON

Answer 4

复制

document.addEventListener("copy", (e) => {
   console.log("copy")
});

粘贴

document.addEventListener("paste", (e) => {
   console.log("paste")
});

- Cybernetic

Answer 5

2022年更新：

如果想要输入元素在粘贴操作时接收onChange事件，请按照以下方式提及onpaste选项

<input onpaste='return true' onChange={handleChange}/>

- Vinayak V Naik