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 的字符串而非表情。

相关推荐
v维焓1 分钟前
C++(思维导图更新)
开发语言·c++·算法
jiet_h2 分钟前
深入解析KSP(Kotlin Symbol Processing):现代Android开发的新利器
android·开发语言·kotlin
_未知_开摆3 分钟前
uniapp APP端在线升级(简版)
开发语言·前端·javascript·vue.js·uni-app
花月C9 分钟前
Spring IOC:容器管理与依赖注入秘籍
java·开发语言·rpc
喝拿铁写前端12 分钟前
不同命名风格在 Vue 中后台项目中的使用分析
javascript·vue.js
ylfhpy15 分钟前
Java面试黄金宝典22
java·开发语言·算法·面试·职场和发展
sen_shan15 分钟前
Vue3+Vite+TypeScript+Element Plus开发-02.Element Plus安装与配置
前端·javascript·typescript·vue3·element·element plus
..过云雨41 分钟前
11. 【C++】模板进阶(函数模板特化、类模板全特化和偏特化、模板的分离编译)
开发语言·c++
予安灵1 小时前
一文详细讲解Python(详细版一篇学会Python基础和网络安全)
开发语言·python
Lizhihao_1 小时前
JAVA-堆 和 堆排序
java·开发语言