文章未分类

JS如何实现点击复制功能，JS点击复制文本

创新博客作者 2023年5月4日 0 评论 531 阅读

首页 › 未分类 ›正文

div，p等标签不可以，建一个文本框标签，不能给display:none; 我们需要对他进行一个定位，让透明看不见找不到，点击复制，将需要复制的内容赋值给文本框，接着对文本框进行全选，在进行复制操作即可

<p id="content">创新博客-y.goolibao.com</p>
<textarea id="text" style="position: fixed;top: 10000px;left: 10000px;opacity: 0;"></textarea>
<button id="CopyBtn">点击复制</button>

<script>
    var content = document.getElementById("content").innerText;
    var text = document.getElementById("text");
    var CopyBtn = document.getElementById("CopyBtn");
    CopyBtn.onclick = function(){
        // 将需要复制的内容赋值给文本框
        text.value = content;
        // 选中文本框的内容
        text.select();
        // 对选中的内容进行复制
        document.execCommand("copy");
    }
</script>

版权说明

文章采用：《署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)》许可协议授权。
版权声明：未标注转载均为本站原创，转载时请以链接形式注明文章出处。如有侵权、不妥之处，请联系站长删除。敬请谅解！