隐藏的 HTML 跨度到剪贴板到 Word

编程问答 2022-04-24

问题描述

场景

我正在开发一种工具，该工具返回某种带有斜体的文本，例如：

这是句子我要复制

此文本位于隐藏的 (display:none) 跨度上，例如：

<span class="d-none">This is <i>the sentence</i> I want to copy</span>

主要思想是使用jquery/javascript插件将文本复制到剪贴板，然后粘贴到Word中，这样您就可以获得：

enter image description here

这是要求，这里的任何内容都可以重做，我不在乎是否需要更改库。

问题：

我怎样才能做到这一点？

我目前的尝试：

我现在（没有任何理由）与clipboard.js
一起工作 我的代码如下：

<span class="d-none" id="ccb">This is <i>the sentence<i> I want to copy</span>
<h3>This is <i>the sentence<i> I want to copy</h3>
<button id="cc" data-clipboard-target="#ccb" class="btn-success btn"><i class="fas fa-paste"></i>copiar al portapapeles</button>


<script>
    new ClipboardJS('#cc');
</script>

这个解决方案的问题是：
跨度隐藏，不起作用。
显示跨度，无法获得h3样式。
如果我复制 h3，我会在 html 中不存在的 Words 中得到粗体。

我不想显示跨度或我不想将代码显示为 h3。

对主要问题的任何帮助或解决 cliboard.js 问题的帮助将不胜感激。

提前致谢，亲切的问候！

解决方法

我在 opacity:0 上用 <span> 解决它

clipboardclipboardclipboard.jshtmljavascriptjquery