js 实现复制文本追加内容 copy 事件

最新推荐文章于 2024-05-02 17:59:36 发布

每天进步一点.

最新推荐文章于 2024-05-02 17:59:36 发布

阅读量686

点赞数

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/weixin_45152848/article/details/130954302

版权

<!DOCTYPE html>
<html lang="en">
<body>
  <div class="copy-wrap">
    <p>123123213</p>
    <p>123123213</p>
    <p>123123213</p>
    <p>123123213</p>
  </div>
  <script>
    const extraData = "\r\n————————————————\r\n附加文本\r\n附加文本2";
    document.querySelector('.copy-wrap').addEventListener('copy', (t)=> {
      if (window.getSelection().getRangeAt(0).toString().length > 10) {
      	// 阻止默认的复制行为
        t.preventDefault();
        // 拼接 extraData
        var e = (window.getSelection() + extraData).replace(/[\u00A0]/gi, " ");
        if (t.clipboardData) {
          t.clipboardData.setData("text/plain", e);
        } else {
          if (window.clipboardData) {
            return window.clipboardData.setData("text", e);
          } else {
            var textarea = document.createElement("textarea");
            textarea.style.cssText = "position: fixed;z-index: -10;top: -50px;left: -50px;",
            textarea.innerHTML = e,
            document.getElementsByTagName("body")[0].appendChild(e),
            textarea.select(),
            document.execCommand("copy")
          }
        }
      }
    }, false)
  </script>
</body>
</html>