Question

我有几个div包含文本段落。我想要实现的是单击div时将段落的内容复制到剪贴板中。

请注意，在这种情况下，div是可单击的按钮。

我可以使用包含文本的按钮来实现此功能，但是我正努力使用div来实现此功能。


<div class="parent">

        <div class="child">
            <p>Text A.</p>
        </div>

        <div class="child">
            <p>Text B.</p>
        </div>

        <div class="child">
            <p>Text C.</p>
        </div>
</div>

Answer 1

您可以使用类似这样的东西：

HTML：

<button id="btn" onclick="myFunction()">Copy text</button>

JS：

function myFunction() {
  var copyText = document.getElementById("btn");
  navigator.clipboard.writeText(copyText.textContent)
}

Answer 2

尝试

function  copy(btn) {
  navigator.clipboard.writeText(btn.innerText)
}

<div class="parent">
        <div class="child" onclick="copy(this)" >
            <p>Text A.</p>
        </div>

        <div class="child" onclick="copy(this)" >
            <p>Text B.</p>
        </div>

        <div class="child" onclick="copy(this)" >
            <p>Text C.</p>
        </div>
</div>

<textarea rows="4" cols="50"></textarea>

Answer 3

1。创建一个<textarea>元素以附加到文档。将其值设置为我们要复制到剪贴板的字符串。

2。将<textarea>元素添加到当前HTML文档中。

3。使用HTMLInputElement.select()选择元素的内容。

4。使用Document.execCommand('copy')将的内容复制到剪贴板。

5。从文档中删除元素。

单击div时将div中的文本复制到剪贴板

3 个答案: