从<p>标签上单击复制文本
从<p>标签上单击复制文本
提问于 2022-04-21 21:05:12
<div class="d-flex flex-row justify-content-between">
<p class="mb-0 me-1 py-2 ps-4 add-text" id="p1">ygwbfewilskfhnewisfklnewiofjfhjky</p>
<button class="btn-primary w-20 px-3 copy-btn" onclick="copyToClipboard('#p1')">Copy<i class="fa-regular fa-copy ps-2"></i></button>
</div>联署材料：
function copyToClipboard(element) {
var $temp = $("<input>");
$("body").append($temp);
$temp.val($(element).text()).select();
document.execCommand("copy");
$temp.remove();
}我想复制p id="p1“中的文本。
我试过这种方法，因为我看到它对别人有用，但对我不起作用
回答 3
Stack Overflow用户
发布于 2022-04-21 21:39:31
您的代码很好，而且没有什么问题。我认为您可能忘记了在其中添加jQuery。可以通过在HTML代码的<head>标记中添加以下代码来做到这一点：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>Stack Overflow用户
发布于 2022-04-22 19:29:15
您的代码工作得很好，您可以查看它这里，如果它仍然不能工作，您可能会阻塞JavaScript。检查以确保您没有阻止JS的扩展，并检查您的浏览器设置以确保JS被允许。
(我需要有代码，因为它是一个代码链接)
<div class="d-flex flex-row justify-content-between">
<p class="mb-0 me-1 py-2 ps-4 add-text" id="p1">ygwbfewilskfhnewisfklnewiofjfhjky</p>
<button class="btn-primary w-20 px-3 copy-btn" onclick="copyToClipboard('#p1')">Copy<i class="fa-regular fa-copy ps-2"></i></button>
</div>
function copyToClipboard(element) {
var $temp = $("<input>");
$("body").append($temp);
$temp.val($(element).text()).select();
document.execCommand("copy");
$temp.remove();
}Stack Overflow用户
发布于 2022-04-22 19:40:53
下面是这样做的一个普通版本。如果您阅读我对OP问题的评论中的博客文章，jQuery方法依赖Adobe，并不是所有浏览器都完全支持。
function copyToClipboard() {
var range = document.createRange();
range.selectNode(document.getElementById("p1"));
window.getSelection().removeAllRanges(); // clear current selection
window.getSelection().addRange(range); // to select text
document.execCommand("copy");
window.getSelection().removeAllRanges();// to deselect
}<div class="d-flex flex-row justify-content-between">
<p class="mb-0 me-1 py-2 ps-4 add-text" id="p1">ygwbfewilskfhnewisfklnewiofjfhjky</p>
<button class="btn-primary w-20 px-3 copy-btn" onclick="copyToClipboard('#p1')">Copy<i class="fa-regular fa-copy ps-2"></i></button>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71960861
复制相关文章
相似问题
腾讯云开发者
