搜羅到兩種相容性還不錯的方式。 1、第一種,通過clipboard.js插件實現(推薦) 此插件封裝了很多種使用方式很方便,具體demo,可以去GitHub上看,clipboard傳送門 2、第二種,純js實現: 上面兩種方式相容性都不錯,親測可用。 ...
搜羅到兩種相容性還不錯的方式。
1、第一種,通過clipboard.js插件實現(推薦)
此插件封裝了很多種使用方式很方便,具體demo,可以去GitHub上看,clipboard傳送門
2、第二種,純js實現:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>CopyDemo</title> </head> <body> <div id=NewsToolBox></div> <div id="text-content"> <p>測試p1</p> <p>測試p2</p> </div> <button id="copy-text-btn">複製</button> </body> </html> <script type="text/javascript"> // 複製全文 document.getElementById("copy-text-btn").onclick=function(){ var ssrsss =document.getElementById("text-content").innerText.replace(/\ +/g, ""); //獲取文本並去掉空格 var flag = copyText(ssrsss); //傳遞文本 alert(flag ? '複製成功' : '複製失敗') }; function copyText(text) { var textarea = document.createElement("textarea"); //創建input對象 var currentFocus = document.activeElement; //當前獲得焦點的元素 var toolBoxwrap = document.getElementById('NewsToolBox'); //將文本框插入到NewsToolBox這個之後 toolBoxwrap.appendChild(textarea); //添加元素 textarea.value = text; textarea.focus(); if (textarea.setSelectionRange) { textarea.setSelectionRange(0, textarea.value.length); //獲取游標起始位置到結束位置 } else { textarea.select(); } try { var flag = document.execCommand("copy"); //執行複製 } catch (eo) { var flag = false; } toolBoxwrap.removeChild(textarea); //刪除元素 currentFocus.focus(); return flag; } </script>
上面兩種方式相容性都不錯,親測可用。