此文记录一下楼主遇到的坑
内容都是实际运行过的 请放心使用
1、实现JS环境中复制文字到剪贴板
主要应用场景为方便用户复制内容 提升用户体验(比如订单号?git clone的地址?等)
去度娘一搜 好家伙 一大堆 然后时间一看 好家伙 排到前面的都是2014年的回答,大部分回答都还一样???
经过MDN 等多方查证,现总结如下
let
点击后即可选中,并将div里的内容复制到剪贴板,使用时直接ctrl + v 即可
但是这种方法楼主没有找到复制多个的方法,即假如我现在有2个div的内容是需要复制的 无法重复添加 只能去先一步获取并拼接(dom.innerHTML)
贴一下mdn上的循环添加获取 楼主去撸了一遍代码 发现并不能实现
2、实现input / textarea中的复制
后来我又发现使用input / textarea进行复制操作 这种方式更加简单 因为二者有一个select() 函数更便捷的复制而不需要去创建select对象与range对象
如下
let
这里动态c一个input 然后再最后remove就好,而不需要在html中硬性使用input / textarea去展示,更加优雅
但是此处注意 当你的txval为多个值拼接 并需要在剪贴板换行时 此方法无法满足
比如你需要这种格式
console打印都是ok的 但是实际复制到文本文档中是一行
要实现换行请使用textarea
let
至此完毕