JS实现复制到剪贴板功能

发表于 2021-11-12 | 分类于前端开发， JavaScript | | 浏览次

字数统计: 155 | 阅读时长 ≈ 1

原生JS实现

原生JS，先使用 select() 选中输入框文本，然后使用 document.execCommand("Copy")复制到剪贴板

前提条件

select() 方法只对 <input> 和 <textarea> 有效
输入框不能有disabled属性
输入框不能有hidden属性
输入框的 width 和 height 不能为0

实现代码

HTML

1
2
3

<div>
    <input id="copyInput" type="text" value="需要复制的文本" />
</div>

var ele = document.getElementById("copyInput");
ele.select();
let c = document.execCommand("Copy");
if (c) {
    alert("复制链接成功！");
} else {
    alert("复制失败！当前浏览器不支持此功能，请手动复制。");
}