js复制文字

Posted 2021-02-11 山上小和尚

一、原理分析

浏览器提供了 copy 命令 ，可以复制选中的内容

document.execCommand("copy")

如果是输入框，可以通过 select() 方法，选中输入框的文本，然后调用  copy 命令，将文本复制到剪切板

但是 select() 方法只对 <input> 和 <textarea> 两个输入框有效,所以要设置一个用这两个标签的缓存区域

 

//要拿到的文字
<button ‘data-text‘=‘待复制文字‘ onclick=‘copy(this)‘>

//html部分,缓存拿到的值,透明为0才行,隐藏是不行的
<textarea style="opacity: 0;" id="txt"></textarea>

//js方法
function copy(obj){
    var content =  $(obj).attr(‘data-text‘);
    $("#txt").val(content);
    var txt=document.getElementById("txt");
    txt.select(); // 选择对象
    document.execCommand("Copy"); // 执行浏览器复制命令
    layer.msg(‘已复制,可粘贴‘);
}