js点击实现一键复制到剪切板

最新推荐文章于 2024-05-11 11:49:42 发布

永不满足的求知者

最新推荐文章于 2024-05-11 11:49:42 发布

阅读量1k

点赞数

分类专栏：前端文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/qq_41154522/article/details/122404565

版权

前端专栏收录该内容

82 篇文章 2 订阅

订阅专栏

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>点击复制</title>
</head>
<body>
    <div onclick="copy(event)">一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字一堆文字</div>
    <br>
    <br>
    <textarea placeholder="点击上方文字，Ctrl + V 即可粘贴到此处" rows="10" cols="30"></textarea>
    <script>
        function copy(e) {
            let transfer = document.createElement('input');
            document.body.appendChild(transfer);
            transfer.value = e.target.innerText;  // 这里表示想要复制的内容
            transfer.focus();
            transfer.select();
            if (document.execCommand('copy')) {
                document.execCommand('copy');
            }
            transfer.blur();
            console.log('复制成功');
            document.body.removeChild(transfer);
        }
    </script>
</body>
</html>