学习记录10----点击复制内容

join1007 的个人博客 / 0 / 1 / 创建于 1年前

<script src="https://cdn.bootcss.com/clipboard.js/2.0.1/clipboard.js"></script>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<a href="javascript:;" id="copyUrl" data-clipboard-text="！！！！！！！！！！！你已经复制到内容了!!!!!!!!!!!">复制链接</a>
<script type="text/javascript">
    var clipboard = new ClipboardJS('#copyUrl')
    clipboard.on('success', function(e) {
        alert("复制成功");
        e.clearSelection();
        console.log(e.clearSelection);
    });
    clipboard.on('error', function(e) {
        alert("当前浏览器不支持此功能，请手动复制。")
    });
</script>

本作品采用《CC 协议》，转载必须注明作者和本文链接

join1007

21 声望

暂无个人描述~

0 人点赞

讨论数量: 1

Egoist-Berserker

课程读者 5 声望

copyToClipboard(text) {
  // 创建一个 textarea 元素
  const textarea = document.createElement('textarea');
  // 设置 textarea 的值为我们想要复制的文本
  textarea.value = text;
  // 将 textarea 添加到 DOM 中
  document.body.appendChild(textarea);
  // 选中 textarea 中的文本
  textarea.select();
  try {
    // 尝试复制文本
    document.execCommand('copy');
    console.log('复制成功');
  } catch (err) {
    console.log('复制失败', err);
  } finally {
    // 不管复制成功还是失败，最后都要清理 DOM
    document.body.removeChild(textarea);
  }
}