js復制文字

一、原理分析

瀏覽器提供了 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('已復制,可粘貼');
}