用ctrl + v检测粘贴文本或右键 - >粘贴

如何检测用户在textarea中用JS粘贴的文本？用ctrl + v检测粘贴文本或右键 - >粘贴

2010-07-09 lam3r4370

可能重复的[如何实时检测作为被粘贴一个链接]（http://stackoverflow.com/questions/1891145/how-does-facebook-detect-when-一个链接被粘贴） – 2010-07-09 09:53:54

不，例如我粘贴“测试textarea”，我想要检测粘贴什么文本，在这种情况下 - “test textarea” – lam3r4370 2010-07-09 10:04:15

您可能无法做到跨浏览器... – galambalazs 2010-07-09 10:07:09

您可以使用粘贴事件检测大多数浏览器粘贴（特别是未Firefox 2中虽然）。当您处理粘贴事件时，记录当前选择，然后设置一个简短的计时器，该粘贴完成后调用一个函数。然后该功能可以比较长度并知道在哪里查找粘贴的内容。像下面这样。为了简洁起见，获取textarea选择的函数在IE中不起作用。看到这里的东西确实：How to get the start and end points of selection in text area?

function getTextAreaSelection(textarea) { 
    var start = textarea.selectionStart, end = textarea.selectionEnd; 
    return { 
     start: start, 
     end: end, 
     length: end - start, 
     text: textarea.value.slice(start, end) 
    }; 
} 

function detectPaste(textarea, callback) { 
    textarea.onpaste = function() { 
     var sel = getTextAreaSelection(textarea); 
     var initialLength = textarea.value.length; 
     window.setTimeout(function() { 
      var val = textarea.value; 
      var pastedTextLength = val.length - (initialLength - sel.length); 
      var end = sel.start + pastedTextLength; 
      callback({ 
       start: sel.start, 
       end: end, 
       length: pastedTextLength, 
       text: val.slice(sel.start, end) 
      }); 
     }, 1); 
    }; 
} 

var textarea = document.getElementById("your_textarea"); 
detectPaste(textarea, function(pasteInfo) { 
    alert(pasteInfo.text); 
    // pasteInfo also has properties for the start and end character 
    // index and length of the pasted text 
});

来源

2010-07-09 11:14:34

非常感谢！ – lam3r4370 2010-07-09 14:15:52

这是每隔1毫秒轮询一次吗？ – chug2k 2012-09-13 00:17:30

@ chug2k：不，它只在每次粘贴1毫秒后（或者任何浏览器代替）运行一次该函数。 – 2012-09-13 08:29:35

以下可以帮助你

function submitenter(myfield,e) 
    { 
    var keycode; 
    if (window.event) keycode = window.event.keyCode; 
    else if (e) keycode = e.which; 
    else return true; 
    if (keycode == //event code of ctrl-v) 
    { 
     //some code here 
    } 

    } 

    <teaxtarea name="area[name]" onKeyPress=>"return submitenter(this,event);"></textarea>

来源

2010-07-09 09:57:04 Salil

是的，但是如果我想要检测用户粘贴什么文本，那么“这里有些代码”会是什么？ – lam3r4370 2010-07-09 09:58:57

在IE 8部作品 - 10

创建自定义代码，以使粘贴命令需要几个步骤。

在onbeforepaste事件中将事件对象returnValue设置为false以启用粘贴快捷菜单项。
通过在onpaste事件处理程序中将事件对象returnValue设置为false来取消客户端的默认行为。这仅适用于具有为其定义的默认行为的对象，例如文本框。
指定通过clipboardData对象的getData方法粘贴选择内容的数据格式。
调用onpaste事件中的方法来执行自定义粘贴代码。

要调用此事件，请执行下列操作之一：

单击鼠标右键，显示快捷菜单并选择粘贴。
或按CTRL + V.

例子

<HEAD> 
<SCRIPT> 
var sNewString = "new content associated with this object"; 
var sSave = ""; 
// Selects the text that is to be cut. 
function fnLoad() { 
    var r = document.body.createTextRange(); 
    r.findText(oSource.innerText); 
    r.select(); 
} 
// Stores the text of the SPAN in a variable that is set 
// to an empty string in the variable declaration above. 
function fnBeforeCut() { 
    sSave = oSource.innerText; 
    event.returnValue = false; 
} 
// Associates the variable sNewString with the text being cut. 
function fnCut() { 
    window.clipboardData.setData("Text", sNewString); 
} 
function fnBeforePaste() { 
    event.returnValue = false; 
} 
// The second parameter set in getData causes sNewString 
// to be pasted into the text input. Passing no second 
// parameter causes the SPAN text to be pasted instead. 
function fnPaste() { 
    event.returnValue = false; 
    oTarget.value = window.clipboardData.getData("Text", sNewString); 
} 
</SCRIPT> 
</HEAD> 
<BODY onload="fnLoad()"> 
<SPAN ID="oSource" 
     onbeforecut="fnBeforeCut()" 
     oncut="fnCut()">Cut this Text</SPAN> 
<INPUT ID="oTarget" TYPE="text" VALUE="Paste the Text Here" 
     onbeforepaste="fnBeforePaste()" 
     onpaste="fnPaste()"> 
</BODY>

全部DOC：http://msdn.microsoft.com/en-us/library/ie/ms536955(v=vs.85).aspx

来源

2013-01-31 13:16:20 Calixto

相当一个古老的线程，但你现在可以使用http://willemmulder.github.com/FilteredPaste.js/代替。它可以让你控制粘贴到textarea或contenteditable的内容。

来源

2013-02-02 16:24:23

我喜欢右键建议

$("#message").on('keyup contextmenu input', function(event) { 
    alert("ok"); 
});

这里瑶池：

来源： Fire event with right mouse click and Paste

来源

2016-03-11 16:02:32

HTML5已经提供onpaste不仅<input/>，也可编辑元素（<p contenteditable="true" /> ，...）

<input type="text" onpaste="myFunction()" value="Paste something in here">

More info here

的

来源

2016-12-02 04:02:43

小心，这不是一个Web标准。 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/onpaste。（另外，MDN比W3Schools对于Web API更可靠） – 2017-05-27 05:14:12

用ctrl + v检测粘贴文本或右键 - >粘贴

回答

相关问题