js点击实现复制url至剪贴板

原创于 2022-09-24 11:54:22 发布 · 647 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端 #开发语言

前端开发常见问题专栏收录该内容

36 篇文章

订阅专栏

本文介绍了如何通过JavaScript的`document.execCommand('copy')`方法实现剪切复制功能，尽管不推荐但仍是常见手段，通过创建临时input元素来操作剪贴板。

document.execCommand(‘copy’)；//实现剪切复制剪切版的主要实现
虽然目前暂时不推荐使用，但是目前也只有这个实现，便还是继续使用
链接：https://developer.mozilla.org/zh-CN/docs/Web/API/Document/execCommand

在这里插入图片描述

const copyUrl = (url) => {
  const input = document.createElement('input');
  document.body.appendChild(input);
  input.setAttribute('value', url);
  input.select();
  if (document.execCommand('copy')) {
    document.execCommand('copy');
   console.log('复制成功')
  }
  document.body.removeChild(input);
};