用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檢測粘貼文本或右鍵 - >粘貼

回答

相關問題