1、主要用到github上的一个开源的项目:clipboard.js
2、clipboard.js 可以实现纯JS复制数据到剪切板中(无需flash支持)跟现在主流的zeroclipboard 比起来方便了不止一点两点(毕竟不是所有人都会装flash插件的)
下面写一些DEMO来记录一下学习:
首先引入依赖JS包:
<script src="../clipboard.min.js"></script>
然后实例化clipboard(clipboard实例化需要指定一个元素,也就是点击指定元素会触发复制方法)
var clipboard = new Clipboard('.btn');
下面是完整DEMO:
<script src="clipboard.min.js"></script>
<textarea id="bar" cols="10" rows="1" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">clipboard.jsd的DEMO演示</textarea>
<!-- Trigger -->
<button class="btn" data-clipboard-action="copy" data-clipboard-target="#bar">
Cut to clipboard
</button>
<script>
var clipboard = new Clipboard('.btn');
clipboard.on('success', function(e) {
console.info('Action:', e.action);
console.info('Text:', e.text);
console.info('Trigger:', e.trigger);
alert("复制成功");
e.clearSelection();
});
clipboard.on('error', function(e) {
console.error('Action:', e.action);
console.error('Trigger:', e.trigger);
});
</script>
这样就可以简单的完成对主流浏览器进行JS复制的操作了,
本例子只是做出了一个基础的操作,
如果想深入了解请到clipboard.js官方网站了解详情,
JS下载地址:http://download.csdn.net/detail/qq_22445455/9619105
官方地址:https://clipboardjs.com/