Cod*_*gry 6 html javascript jquery
<!DOCTYPE html>
<html>
<head>
<title>Clipboard Paste Text</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
</head>
<body>
<input type="text" placeholder="paste in here" />
<script type="text/javascript">
/* <![CDATA[ */
$(document, 'input[type="text"]').on('paste', function(event) {
var oEvent = event.originalEvent;
oEvent.preventDefault();
var clipText = '';
if(window.clipboardData){
clipText = window.clipboardData.getData('Text');
}else if(typeof oEvent == 'object' && oEvent.clipboardData){
clipText = oEvent.clipboardData.getData('text/plain');
}
// console.log('Pasted ' + clipText.length + ' characters.');
alert('Pasted ' + clipText.length + ' characters.');
});
/* ]]> */
</script>
</body>
</html>
^ 我有这样的演示代码.它结合了paste event上INPUT[TEXT]和DOCUMENT.
Ctrl+V没有插入符号(外部输入和textarea)的内容.Ctrl+V外部的可粘贴对象(输入和文本区域).paste event所有inputs和textareas.)我想在所有三个浏览器中捕获没有输入文本框的Ctrl + V. 我现在正在使用文本输入,但我想完全删除它并在文档级别捕获事件,而不是在输入框级别.可以吗？
PS:如果粘贴在textarea中,我需要粘贴大量的文本来浏览浏览器.我在一个存储它hidden field通过捕获paste event的inputbox.我当前的解决方案工作正常,但我仍然想知道我是否缺少某些东西或FF和IE只会paste events在输入/ textarea级别触发.
PPS:我已经使用了这个spellcheck=false和autocomplete=off技巧来允许更多的文本粘贴...但它仍然有点挂起,因为我不需要它可编辑,这是一个更好的解决方案.
PPS:我的JS技能相当生疏(它们更像是JS生存模式)而且我不担心浏览器的向后兼容性,因为那些经常使用这种更新的人很难.
做了一个jsfiddle:http://jsfiddle.net/ninty9notout/A42UN/
来自http://www.w3.org/TR/clipboard-apis/ 5.1.3粘贴事件
粘贴事件在不可编辑的上下文中没有默认操作，但无论如何都会触发该事件。
Chrome 使用惰性粘贴事件，这意味着它不会检查焦点元素是否是可编辑内容区域，这就是粘贴事件在文档上起作用的原因。
对于 Firefox 和 IE，它实际上会在允许触发粘贴事件之前检查元素。所以基本上，您需要一个内容可编辑元素才能使粘贴事件在所有浏览器中工作。
我尝试使用内容可编辑的 DIV 作为页面上的主要 div，我认为它似乎会产生您正在寻找的结果。如果答案看起来有点“hackish”，请原谅我。
您可以将 contenteditable div 作为容器 div 放置到网页的其余部分，并通过在用户按下某个键时返回 false 来不允许用户在该 div 中键入内容，除非该键是用于粘贴的键。
如果你想看看我是如何做到的，这里有一个小提琴。
html
<div id="pageDiv" contenteditable><div>other content</div></div>
CSS
html, body, #pageDiv {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
javascript:
$(document).on('paste', function(event){
var oEvent = event.originalEvent;
if (event.preventDefault())
event.preventDefault();
var clipText = '';
if(window.clipboardData){
clipText = window.clipboardData.getData('Text');
}else if(typeof oEvent == 'object' && oEvent.clipboardData){
clipText = oEvent.clipboardData.getData('text/plain');
}
// console.log('Pasted ' + clipText.length + ' characters.');
alert('Pasted ' + clipText.length + ' characters.');
});
$('#pageDiv').keydown(function(e){
if (!event.ctrlKey)
return false;
});
一些注意事项：
用户仍然必须单击页面主体才能激活粘贴事件。即单击浏览器本身可能还不够。
在 firfox 中，您需要在子 div 中设置 contenteditable="false"，否则用户可以向这些元素添加文本。
我必须将 div 的高度和宽度设置为 100%。如果你的html和body不是100%的高度和宽度，它在IE中将不起作用。
我必须将 IE 的 jquery 库更改为较新版本，以便粘贴事件能够在文档上运行。
希望这可以帮助