解决ios17无法复制的问题

原代码写过一片js实现复制的代码 那段代码有问题 以下是之前写的一段有问题的原代码:

javascript 复制代码
 let url = "kkkkkk";
      const hiddenTextarea = document.createElement("textarea");
      hiddenTextarea.style.position = "absolute";
      hiddenTextarea.style.left = "-9999px";
      hiddenTextarea.setAttribute("readonly", "");
      hiddenTextarea.value = url;
      document.body.appendChild(hiddenTextarea);
      hiddenTextarea.select();
      hiddenTextarea.focus();
      document.execCommand("copy");
      showToast("复制成功");
      // 清除虚拟焦点元素
      document.body.removeChild(hiddenTextarea);

之前ios都是好好的 奈何ios升级了17版本 于是我的复制就不生效了 不过又发现一段新代码 尝试了下 ios17可正常复制

修改后:

javascript 复制代码
  const textarea = document.createElement("textarea");
      textarea.style.position = "fixed";
      textarea.style.top = 0;
      textarea.style.left = 0;
      textarea.style.border = "none";
      textarea.style.outline = "none";
      textarea.style.resize = "none";
      textarea.style.background = "transparent";
      textarea.style.color = "transparent";
      textarea.value = url; // 修改文本框的内容
      document.body.appendChild(textarea);
      textarea.select(); // 选中文本
      try {
        const msg = document.execCommand("copy") ? "复制成功" : "复制失败";
        // H.$toast("复制成功");
        showToast(`${msg}`);
      } catch (err) {
        // alert("unable to copy", err);
        // H.$toast("复制失败");
        showToast("复制失败");
      }
      document.body.removeChild(textarea);

原因可能是第一段代码中的 hiddenTextarea.setAttribute("readonly", "");";设置导致在iOS 17上无法复制。而第二段代码中,将这个属性删除,从而在iOS 17上可以正常复制。

so 问题得到正常解决!~

相关推荐
panxianren13 小时前
Bun 1.4 的 bun test --parallel 将 4 秒的测试套件缩短到约 1 秒
java·javascript
陈随易15 小时前
bm2,Node.js 与 Bun 项目部署新选择
前端·后端·程序员
可乐鸡翅yeah_16 小时前
FFmpeg 生成 HLS 独立分片 independent‑segments 参数到底有什么用
javascript·ffmpeg·音视频·safari·m3u8
福兮说16 小时前
canvas 旋转图片的六个坑:四角被裁、Math.ceil 多出 1px 黑边、JPG 角发黑、翻转方向反了
前端·javascript·图像处理·canvas
Ai-_Man18 小时前
您您这可以把Grok的多个会话比如说。左侧的多个会话一次性导出吗?不是单条会话里面的多次会对话。AI导出鸭
javascript·人工智能·ai·小程序·电脑
传人once18 小时前
多图片上传预览功能如何写
前端·css·html·jquery·html5
Eric.4618 小时前
Wan‑Animate+MiniMax-H3 本地部署 AI 漫剧流水线:8G 显存动作迁移与动态分镜工程实战
前端·人工智能·comfyui·ai漫剧
liangshanbo121518 小时前
JavaScript 异步核心主线
javascript·事件循环·异步操作
传人once19 小时前
悬停旋转放大和位移效果如何写
javascript·css·动画
库拉镜像AI牛牛19 小时前
短剧内容自动化生产:知漫剧工作室落地教程
大数据·服务器·前端·人工智能·语音识别