Detailed explanation of usage of clipboardData object in javascript

Detailed explanation of usage of clipboardData object in javascript_javascript skills

WBOY

Release： 2016-05-16 15:59:31

Original

1488 people have browsed it

The example in this article describes the usage of clipboardData object in javascript. Share it with everyone for your reference. The specific analysis is as follows:

clipboardData object, please note that the clipboard in the web page can only set the Text type so far, that is, it can only copy text
clearData("Text") clears the pasteboard
getData("Text") reads the value of the pasteboard
setData("Text",val) sets the value of the pasteboard

When copying, the oncopy event of the body is triggered. Directly return false to prohibit copying. Note that text in the web page cannot be copied

Many elements also have oncopy and onpaste events

1. Copy text to clipboard

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title></title>
 <script type="text/javascript">
 function CopyLinkAddress() {
  clipboardData.setData("Text", "请复制网址到您的QQ:" + location.href);
  alert("复制成功!");
 }
 </script>
</head>
<body>
 <input type="button" value="复制网址" onclick="CopyLinkAddress()" />
</body>
</html>

Copy after login

2. Copying and pasting are prohibited

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title></title>
 <script type="text/javascript">
 function CopyLinkAddress() {
  clipboardData.setData("Text", "请复制网址到您的QQ:" + location.href);
  alert("复制成功!");
 }
 </script>
</head>
<!--<body oncopy="alert('禁止复制');return false;">-->
<body>
 <input type="button" value="复制网址" onclick="CopyLinkAddress()" />
 测试复制的文本<br />
 手机号码1:<input type="text" /><br />
 手机号码2:<input type="text" 
 onpaste="alert('禁止粘贴，必须手工录入!');return false;" />
</body>
</html>

Copy after login

3.Add source when copying clipboardData object

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title></title>
 <script type="text/javascript">
 function ModifyCopyData() {
  clipboardData.setData('Text',clipboardData.getData('Text') +
   '\r\n来自Pigeon网站' + location.href);
 }
 </script>
</head>
<!--不能直接在oncopy中调用ModifyCopyData函数
 需设定定时器,0.1秒后执行,这样就不再oncopy的执行调用堆栈上了
-->
<body oncopy="setTimeout('ModifyCopyData()',100)">
 脚本之家:www.jb51.net
</body>
</html>

Copy after login

I hope this article will be helpful to everyone’s C# programming.