在知乎复制的文本为什么会自带一些版权声明，这个功能是如何实现的?
比如说我复制的
123456
最后出现的是
著作权归作者所有。
商业转载请联系作者获得授权，非商业转载请注明出处。
作者：stevenliuyi
链接：http://www.zhihu.com/question/20451870/answer/15168034
来源：知乎
123456
回复内容：
比如说我复制的
123456
最后出现的是
著作权归作者所有。
商业转载请联系作者获得授权，非商业转载请注明出处。
作者：stevenliuyi
链接：http://www.zhihu.com/question/20451870/answer/15168034
来源：知乎
123456
大体思路：
答案区域监听
copy事件，并阻止这个事件的默认行为。获取选中的内容（
window.getSelection()）加上版权信息，然后设置到剪切板（clipboardData.setData()）。
下面的代码实现了一个简单的DEMO
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body>
<div id="answer">测试数据<b>test</b></div>
<script>
function setClipboardText(event){
event.preventDefault();
var node = document.createElement('div');
//对documentfragment不熟，不知道怎么获取里面的内容，用了一个比较笨的方式
node.appendChild(window.getSelection().getRangeAt(0).cloneContents());
var htmlData = '<div>著作权归作者所有。<br />'
+ '商业转载请联系作者获得授权，非商业转载请注明出处。<br />'
+ '作者：tiantian<br />链接：http://segmentfault.com/u/tiantian_<br />'
+ '来源：segmentfault<br /><br />'
+ node.innerHTML
+ '</div>';
var textData = '著作权归作者所有。\n'
+ '商业转载请联系作者获得授权，非商业转载请注明出处。\n'
+ '作者：tiantian\n链接：http://segmentfault.com/u/tiantian_\n'
+ '来源：segmentfault\n\n'
+ window.getSelection().getRangeAt(0);
if(event.clipboardData){
event.clipboardData.setData("text/html", htmlData);
event.clipboardData.setData("text/plain",textData);
}
else if(window.clipboardData){
return window.clipboardData.setData("text", textData);
}
};
var answer = document.getElementById("answer");
answer.addEventListener('copy',function(e){
setClipboardText(e);
});
</script>
</body>
</html>看了知乎的代码，大致也是这么实现的，但是还加入了一些其他的判断，比如如果答案设置了不能复制，则阻止copy事件，并显示提示信息，如果复制的文本长度小于42的话，不会加上版权信息。
copy事件可以参考：
https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLElement/oncopy
http://codebits.glennjones.net/editing/setclipboarddata.htm
没有这个问题啊
热AI工具
Undresser.AI Undress
人工智能驱动的应用程序，用于创建逼真的裸体照片
AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。
Undress AI Tool
免费脱衣服图片
Clothoff.io
AI脱衣机
Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸！
热门文章
热工具
记事本++7.3.1
好用且免费的代码编辑器
SublimeText3汉化版
中文版，非常好用
禅工作室 13.0.1
功能强大的PHP集成开发环境
Dreamweaver CS6
视觉化网页开发工具
SublimeText3 Mac版
神级代码编辑软件(SublimeText3)
了解HTML，CSS和JavaScript：初学者指南
Apr 12, 2025 am 12:02 AM
WebDevelovermentReliesonHtml，CSS和JavaScript：1）HTMLStructuresContent，2）CSSStyleSIT和3）JavaScriptAddSstractivity，形成thebasisofmodernWebemodernWebExexperiences。
PHP和Python：比较两种流行的编程语言
Apr 14, 2025 am 12:13 AM
PHP和Python各有优势，选择依据项目需求。1.PHP适合web开发，尤其快速开发和维护网站。2.Python适用于数据科学、机器学习和人工智能，语法简洁，适合初学者。
PHP行动：现实世界中的示例和应用程序
Apr 14, 2025 am 12:19 AM
PHP在电子商务、内容管理系统和API开发中广泛应用。1)电子商务：用于购物车功能和支付处理。2)内容管理系统：用于动态内容生成和用户管理。3)API开发：用于RESTfulAPI开发和API安全性。通过性能优化和最佳实践，PHP应用的效率和可维护性得以提升。
PHP：网络开发的关键语言
Apr 13, 2025 am 12:08 AM
PHP是一种广泛应用于服务器端的脚本语言，特别适合web开发。1.PHP可以嵌入HTML，处理HTTP请求和响应，支持多种数据库。2.PHP用于生成动态网页内容，处理表单数据，访问数据库等，具有强大的社区支持和开源资源。3.PHP是解释型语言，执行过程包括词法分析、语法分析、编译和执行。4.PHP可以与MySQL结合用于用户注册系统等高级应用。5.调试PHP时，可使用error_reporting()和var_dump()等函数。6.优化PHP代码可通过缓存机制、优化数据库查询和使用内置函数。7
PHP与Python：了解差异
Apr 11, 2025 am 12:15 AM
PHP和Python各有优势，选择应基于项目需求。1.PHP适合web开发，语法简单，执行效率高。2.Python适用于数据科学和机器学习，语法简洁，库丰富。
PHP的持久相关性：它还活着吗？
Apr 14, 2025 am 12:12 AM
PHP仍然具有活力，其在现代编程领域中依然占据重要地位。1)PHP的简单易学和强大社区支持使其在Web开发中广泛应用；2)其灵活性和稳定性使其在处理Web表单、数据库操作和文件处理等方面表现出色；3)PHP不断进化和优化，适用于初学者和经验丰富的开发者。
PHP与其他语言：比较
Apr 13, 2025 am 12:19 AM
PHP适合web开发，特别是在快速开发和处理动态内容方面表现出色，但不擅长数据科学和企业级应用。与Python相比，PHP在web开发中更具优势，但在数据科学领域不如Python；与Java相比，PHP在企业级应用中表现较差，但在web开发中更灵活；与JavaScript相比，PHP在后端开发中更简洁，但在前端开发中不如JavaScript。
PHP与Python：核心功能
Apr 13, 2025 am 12:16 AM
PHP和Python各有优势，适合不同场景。1.PHP适用于web开发，提供内置web服务器和丰富函数库。2.Python适合数据科学和机器学习，语法简洁且有强大标准库。选择时应根据项目需求决定。
