• 首页
  • 狐文
  • 狐图
  • About
狐窝
OvO
  1. 首页
  2. Wordpress
  3. 正文

JavaScript 复制图片

2020年02月23日 321点热度 0人点赞 0条评论

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>
标签: html javascript js
最后更新:2020年02月23日

OvO

狐狸

点赞
< 上一篇
最新 热点 随机
最新 热点 随机
EFI Shell 命令参考命令 说明 证书的SCT相关 ssl证书生成时插入OID TrueNAS SCALE docker安装使用联合文件系统mergerfs Iptables 端口(流量)转发 如何在GIT中删除第一个提交 TrueNas 虚拟机无法连接主机 dnsmasq ipset iptables 实现对流量进行分流 新版 Ubuntu 修改IP DCHP K3S 创建portainer 通过声音进行数据传输 Windows精简部署相关简易内容 ConstraintLayout 和 Coordinator 对比 Android 为View分配id wireshark解析TCP tcpdump rpcapd 相关编译方法 双网卡调整优先级 Android 禁用IPv6
EFI Shell 命令参考命令 说明
WebDriver中页面滚动(scrolling) 2020最好的Linux发行版 windows和linux的远程桌面 MyBatis3 用log4j在控制台输出 SQL dnsmasq ipset iptables 实现对流量进行分流 Maven启用代理访问 iptables入门06(DNS端口53设置 Linux系统下如何使用SSD固态硬盘 IDEA识别不出Java JDK解决方案 C++解密Chrome80版本数据库的方法示例代码 Ubuntu缩放比例设置 MongoDB中的多表关联 Gmail邮件客户端跳板解决方案 验证码破解技术四部曲之环境搭建篇(一) Linux桌面密码管理器:Bitwarden,Buttercup,KeePassXC,Enpass,myki SELinux管理配置 bzroot解包、打包 发送ctrl-c to 到 screen session
标签聚合
com 下载 android 未分类 chrome ssl docker linux 网卡 https git 密码 windows http ipv 编译

COPYRIGHT © 2020 狐窝. ALL RIGHTS RESERVED.

THEME KRATOS MADE BY VTROIS