emoji表情无法进行复制(在js中传递)

html 复制代码
<span id="encoded-emoji"></span>

之前使用的code标签 可能是这个原因导致无法进行复制(复制出来的是变量名字)

下面的是原来的复制函数

javascript 复制代码
function copyToClipboard(text) {
            var textArea = document.createElement("textarea");
            textArea.value = text;
            document.body.appendChild(textArea);
            textArea.select();
            try {
                var successful = document.execCommand('copy');
                alert('内容已复制到剪切板');
            } catch (err) {
                alert('无法复制到剪切板,请手动复制。');
            }
            document.body.removeChild(textArea);
        }

下面的是修改后的

javascript 复制代码
function copyToClipboard(elementId) {
  // 获取要复制的文本
  var textToCopy = document.getElementById(elementId).textContent;
  // 创建一个临时的textarea元素用于复制
  var textArea = document.createElement("textarea");
  textArea.value = textToCopy;
  document.body.appendChild(textArea);
  textArea.select();
  try {
    var successful = document.execCommand('copy');
    var msg = successful ? '复制成功' : '复制失败';
    alert(msg);
  } catch (err) {
    alert('无法复制');
  }
  // 移除临时textarea元素
  document.body.removeChild(textArea);
}
  • 参数类型:

    • 第一个函数接受一个字符串。
    • 第二个函数接受一个元素的 ID。
  • 获取复制内容的方式:

    • 第一个函数直接使用传入的字符串。
    • 第二个函数通过元素 ID 来获取页面元素的文本内容。
  • 适用场景:

    • 第一个函数适用于您已经有一个字符串,并且想要复制这个字符串到剪贴板的情况。
    • 第二个函数适用于您想要复制页面中某个元素内的文本内容到剪贴板的情况。
  • 复制的内容:

    • 第一个函数会复制传入的字符串,包括任何格式化字符,如 emoji。
    • 第二个函数会复制指定元素的 textContent,这通常是纯文本,不包括任何 HTML 标签或样式。如果元素包含 HTML 格式的文本(如 <span> 或 <img> 标签),这些标签不会被复制。

在处理 emoji 时,如果 emoji 是以文本形式嵌入的(例如,使用 Unicode 字符),两个函数都应该能够正常工作。但如果 emoji 是以图像或其他非文本元素的形式嵌入的,那么第二个函数可能无法复制它们,因为它只复制文本内容。第一个函数会直接复制包含 emoji 的字符串而非表情。

相关推荐
a努力。3 分钟前
四维解析Agent记忆架构:从零实战LangGraph长期记忆
java·开发语言·数据库
Wang's Blog11 分钟前
Java 项目部署之 Docker工具快速入门: Docker Compose 初识与安装
java·开发语言·docker
niucloud-admin17 分钟前
JAVA V6 多商户商城 开发文档——项目启动
java·开发语言·python
学逆向的21 分钟前
C 控制台指令
c语言·开发语言·网络安全
沫璃染墨22 分钟前
从零入门数据结构与算法(一):复杂度分析——从算法效率到时间与空间复杂度
c语言·开发语言·数据结构·笔记·算法·飞书
怕浪猫26 分钟前
12个UI组件库,Star最低的下载最多
前端·javascript·面试
溪语流沙33 分钟前
【Web全栈进阶】Vue3起步:组件、模板语法、响应式数据
前端·javascript·vue.js·css3
贾宝玉的玉宝贾41 分钟前
FreeSWITCH 简单图形化界面 70 - 监听/密语的lua脚本
开发语言·junit·lua·voip·freeswitch·sip·ippbx
Wang's Blog43 分钟前
Java 项目部署之 Docker工具快速入门: 镜像命令从 pull 到 load 的完整实操
java·开发语言·docker
北京盛世宏博1 小时前
异地机房采集踩坑笔记:以太网温湿度记录仪跨网段通信调试实战
开发语言·笔记·单片机·php·传感器·温湿度