常用函数之js复制图片至剪切板

本文记录了在JavaScript中实现Echart图表复制到剪切板功能遇到的挑战,包括 Clipboard API 的限制和兼容性问题。作者提供了一个结合两种方案的完整代码,能确保在Safari、QQ和Chrome等浏览器中正常工作。
摘要由CSDN通过智能技术生成

背景

最近在工作中遇到了一个需求,点击按钮将Echart图复制到剪切板,然后按Ctrl(command)+V可以直接复制到聊天软件&文档编辑器中。本以为这是一个比较简单的需求,好像找了一圈资料,发现事情并不简单,故写下此文记录并分享。

常见方案

比较常见且有效的方案肯定是Clipboard API,不多说,直接上代码(手敲,如错误之处请指正):

const copyToBoard1 = (url: string) => {
   
    const img = new Image();
    img.src = url;
    img.setAttribute('crossOrigin', 'Anonymous');
    img.onload = () => {
   
        const width = img.width;
        
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值