javascript中clipboardData对象用法详解

前端技术 2023/09/06 JavaScript

本文实例讲述了javascript中clipboardData对象用法。分享给大家供大家参考。具体分析如下：

clipboardData对象  ,注意网页里剪贴板到现在只能设置Text类型，即只能复制文本
clearData(\"Text\")清空粘贴板
getData(\"Text\")读取粘贴板的值
setData(\"Text\",val)设置粘贴板的值

当复制的时候body的oncopy事件被触发,直接return false就是禁止复制,注意是不能复制网页里的文本了
<body oncopy=\"alert(\'禁止复制!\');return false;\">
很多元素也有oncopy,onpaste事件

1.复制文本到剪贴板

<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>

2.禁止复制,和禁止粘贴

<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>

3.clipboardData对象复制时添加来源

<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)\">
 phpstudy:www.phpstudy.net
</body>
</html>

希望本文所述对大家的C#程序设计有所帮助。

本文地址：https://www.stayed.cn/item/14824

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案