clipboard.js是一个github上的开源项目,clipboard.js 实现了纯 JavaScript (无 Flash)的浏览器内容复制到系统剪贴板的功能。可以在浏览器和 Node 环境中使用。支持 Chrome 42+、Firefox 41+、IE 9+、Opera 29+
clipboard.js项目主页:https://github.com/zenorocha/clipboard.js
1.引入库
<script type="text/javascript" src="${static_components }/clipboard/clipboard.min.js"></script>
2.操作
1.data-clipboard-text:里面代表要复制的文字
<div class="psw-btn" data-clipboard-text="*****"> 复制兑换码 </div>
==================js
var clipboard = new Clipboard('.psw-btn');//填入触发dom元素 clipboard.on('success', function(e) { alert('复制成功!') //====layer.msg('复制成功!');layer是一个提示框插件,就不用自己写样式了 e.clearSelection(); });
2.data-clipboard-action="copy"//代表是cut还是copy ,cut操作只适用于<input>或<textarea>元素。
data-clipboard-target="div"//代表复制的目标元素
在这里输入文字:<textarea id="textarea1"></textarea><br>
在这里粘贴<textarea id="textarea2"></textarea><br>
<!--测试4-->
<!--测试,通过按钮的data-clipboard-target属性获取指id的标签中的值中 -->
<button class="btn4" data-clipboard-action="copy" data-clipboard-target="#textarea1">点击测试4</button>
var clipboard = new Clipboard('.btn4');//填入触发dom元素
clipboard.on('success', function(e) {
alert('复制成功!') //====layer.msg('复制成功!');layer是一个提示框插件,就不用自己写样式了 e.clearSelection(); });
e.clearSelection(); });
如果你的复制不成功,就要看看body有没有设置以下字眼,把他们去掉即可
oncut="return false;" oncopy = "return false"千万不要加这些,不然用啥都复制剪切不了