JS复制页面中的图片,原理是以html的方式复制到其他地方,不支持html解析的编辑器粘贴会有问题,类似qq这种可能会被禁止获取图片。
实际使用不如浏览器右键点击复制
使用js的复制框架实现
<html> <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <script type="text/javascript" src="https://cdn.bootcss.com/clipboard.js/2.0.4/clipboard.min.js"></script> <script type="text/javascript"> $(function(){ var clipboard = new ClipboardJS('.fq-copy', { target: function() { return document.querySelector('.layui-layer-content'); } }); }); </script> <body> <span class="fq-copy">复制</span> <span class="layui-layer-content"> <img src='https://www.baidu.com/img/bd_logo1.png?where=super' alt='' style='width:150px;'><br/>描述文字~! </span> <!-- 必须放在节点后面才能加载 <script type="text/javascript"> function _copy(anniu,content){ var clipboard = new ClipboardJS(anniu, { target: function(e) { return document.querySelector(content); } }); clipboard.on('success', function(e) { alert('复制成功!!'); console.info('Action:', e.action); console.info('Text:', e.text); console.info('Trigger:', e.trigger); e.clearSelection(); }); clipboard.on('error', function(e) { alert('复制失败!') console.error('Action:', e.action); console.error('Trigger:', e.trigger); }); } _copy('.fq-copy','.layui-layer-content'); </script> --> </body> </html>