我们在设计网站体验的时候，是不是有可能设置防止复制内容，但是有些必须让用户复制的优惠券、代码如何避开可以让复制呢？这里，我们可以通过 Clipboard.js 第三方开源插件实现指定内容的可复制。
1、引入Clipboard.js
这里，我们可以从官方下载到Clipboard.js文件。
下载地址：https://github.com/zenorocha/clipboard.js/archive/master.zip
2、简易功能
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>乐在云</title>
<script src=".../clipboard.min.js"></script>
</head>
<body>
<span>优惠码：<span id="myInput">要复制的代码</span></span>
<button id="copyInput">点击复制</button>
<script>
new ClipboardJS('#copyInput', {
text: function(trigger) {
return document.getElementById("myInput").innerHTML;
}
}).on('success', function(e) {
alert("复制成功");
e.clearSelection();
}).on('error', function(e) {
alert('Error!');
});
</script>
</body>
</html>
这是一个简易的可以复制指定代码的功能，我们可以根据需要修改对应样式。如果是指定CMS编辑器可以添加小按钮工具到编辑器。
评论