「每天进步一点点」看JavaScript如何实现文本复制
先看下最终效果:
原理分析:
该功能主要是利用浏览器提供的copy命令,可以复制选中的内容。
如果是输入框,可以通过 select() 方法,选中输入框的文本,然后调用 copy 命令,将文本复制到剪切板。但select只对input和textarea有效,对于p标签无能为力。
最终的实现方法是:增加一个隐藏的textarea(透明度为0,这里不能用hidden,否则无法获取到内容),点击复制的时候将p标签的innerText复制给textarea,在通过textarea的select()方法选中内容,执行copy命令。
HTML代码结构:
JS代码: