Clipboard.js实现复制文本到剪贴板功能

Clipboard.js是一个轻量级的实现复制文本到剪贴板功能的JavaScript插件,该插件可以将输入框,文本域,DOM节点元素中的文本内容复制到剪贴板中。

官网地址:https://clipboardjs.com/ 

浏览器兼容性:兼容Chrome、Firefox、Opera、Safari、IE9+

对于不兼容的浏览器版本也有优雅的降级处理,可以采用下面的方式

clipboard.on('error', function(e) {
    alert('请选择手动复制!')
});

使用方法如下:

1、在页面引入clipboard.js


2、从元素内容复制文本

设置触发元素的data-clipboard-action属性,该属性的值为copy(复制)/cut(剪切)

设置data-clipboard-target属性,该属性值是要复制/剪切的目标元素的ID


http://blog.csdn.net/oucqsy

复制
3、从元素属性复制文本

 复制

4、执行JS事件

var clipboard = new Clipboard('#copyBtn');
       clipboard.on('success', function(e) {
			e.clearSelection();
           console.log('success');
       });
       clipboard.on('error', function(e) {
           console.log('error');
       });





你可能感兴趣的:(JS)