1.原生js,需搭配input 框使用,input 框不能hidden ,不能display:none。 可以设置成透明度为0
var input = document.getElementById("input"); input.select(); // 选中文本 document.execCommand("copy"); // 执行浏览器复制命令
2.使用clipboard.js
https://lib.baomitu.com/clipboard.js/2.0.6/clipboard.min.js
<div style="text-align: center;" class="copyNbb" data-clipboard-text="复制的文本" data-clipboard-action="copy">
</div>
var clipboard = new ClipboardJS('.copyNbb'); clipboard.on('success', function (e) { // 清除文本选中状态 e.clearSelection(); // layer.msg("复制成功,打开微信,粘贴搜索"); $('.block-c').removeClass('hidden'); $('.block-c').show(); }); clipboard.on('error', function (e) { console.log('复制失败,请手动复制打开微信,粘贴搜索'); });
clipboard.js 同时复制 文本与图片。
用一个div 包裹住要复制的文本及内容
<div class="copy-mb"> <span class="layui-layer-content"> {{form.copytext}} <img class="" :src="item" style=" 50px" v-for="(item , index) in form.copyImg" :key="index" /><br /> </span> </div>
然后触发代码里面加
var clipboard = new ClipboardJS('.copyNbb', { target: function () { return document.querySelector('.layui-layer-content'); //选中那个div }, });
注意:如果是复制到微信编辑栏,图片必须为http