JSFiddle - React, Tailwind, and code Playground
HTML
<div id="pastearea" >Paste plain text here without focusing the text input below first.
<div>
<label>Captured pasted text:</label>
<span id="textdest"></span>
</div>
</div>
<input id="secretinput"/>
CSS
#pastearea {
height: 100px;
}
#pastearea div {
margin-top: 1em;
margin-left: 2em;
color: grey;
}
#secretinput {
position: absolute;
left: 8px;
top: 200px;
}
JavaScript
$(function () {
$(window).bind('keydown', function (e) {
// Cmd-V
if (e.which == 86 && e.metaKey) {
if (e.target.nodeName.toUpperCase() !== "INPUT")
$('#secretinput').focus();
}
});
$(window).bind('beforepaste', function (e) {
return false;
});
$(window).bind('paste', function (e) {
var clipboardData = e.originalEvent.clipboardData;
console.log(clipboardData);
$('#textdest').html(clipboardData.getData('text/plain'));
});
});