使用clipboard.js实现复制功能

最近在开发中，使用原生js复制时，发现在360 7.1的低版本中无法实现代码的复制，

随后便网上找了插件实现复制功能，检验后，发现在低版本也支持

demo：

<input id="contents" type="text" value="" style="position: relative;z-index: -9999 ">

<button class="ydCopy" @click="copyUri" data-clipboard-action="copy" data-clipboard-target="#contents">复制链接button>

id为contents的input输入框是作为复制的目标对象，button作为点击按钮，图中button使用了vue，

js脚本中

copyUri: function () {

    /*var e=document.getElementById("contents");//对象是contents
    e.select(); //选择对象 （全选）
    document.execCommand("Copy"); //执行浏览器复制命令*/


   

var clipboard = new ClipboardJS('.ydCopy');

clipboard.on('success', function(e) {
  
    common.layer.msg("链接复制成功！");
});

clipboard.on('error', function(e) {
   
    layer.alert('链接复制失败，请手动复制下载地址：
 ' + $('#contents').val() + '', {
        skin: 'layui-layer-molv' //样式类名
        ,closeBtn: 0
    }, function(){
     
       layer.closeAll();
    });
});

}

三行代码解决！（引入clipboard.js 文件）

clipboard.js源码地址：https://github.com/zenorocha/clipboard.js

里面的demo模块中有具体的例子，简单且实用