超简单的复制文本功能

最新推荐文章于 2023-12-14 20:40:23 发布

原创最新推荐文章于 2023-12-14 20:40:23 发布 · 172 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript

这段代码展示了如何在浏览器环境中实现复制文本到剪贴板的功能。通过监听'copy'事件，阻止默认行为，然后设置clipboardData来存放要复制的文本，最后执行document.execCommand('copy')来完成复制操作。当复制成功后，会弹出提示信息。

// 调用封装好的方法，传入文本值
copyFd('文本值')
const copyFd = (val) => {
      let copy = function (e) {
          e.preventDefault();
          console.log('copy');
          if (e.clipboardData) {
              e.clipboardData.setData('text/plain', val);
              alert('复制成功')
          } else if (window.clipboardData) {
              window.clipboardData.setData('Text', val);
              alert('复制成功')
          }
      }
      window.addEventListener('copy', copy);
      document.execCommand('copy');
      window.removeEventListener('copy', copy);
 }