關於點擊按鈕復制文本


 要實現的是利用js點擊自定義的復制按鈕,讓邀請碼復制到剪切板上,剛開始我用的是execCommand這個方法:

部分代碼如下:

html部分

<div>我的邀請碼<input id="invite_code" value="567w899"/></div>
<div onclick="copyToClipboard('invite_code')" >復制</div>

js部分(要注意的是這個方法在蘋果上使用無效,原理就是新創建一個input標簽用於存放復制的內容,但其並不顯示在頁面上)

function copyToClipboard(elementId) {
// 創建元素用於復制
var aux = document.createElement("input");
// 獲取復制內容
var content = document.getElementById(elementId).value;
// 設置元素內容
aux.setAttribute("value", content);
// 將元素插入頁面進行調用
document.body.appendChild(aux);
// 復制內容
aux.select();
//復制選中的文字到剪貼板;
// document.execCommand('copy');

try{
document.execCommand('copy');
// // 刪除創建元素
document.body.removeChild(aux);
alert("復制成功")
}catch(exception){
alert("復制失敗")
}
}

后來想在蘋果上使用,又嘗試了clipboard.js的方法,但是這個方法發現移動端無效只有PC端有用(具體使用方法前往:https://clipboardjs.com/)


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM