示例一
HTML部分：
<input type="text" id="text_input" />
<button type="button" id="copy_text">copy</button>
js部分：
var inputElem = document.getElementById('text_input');
var btnElem = document.getElementById('copy_text');
btnElem.addEventListener('click', function() {
if(!document.execCommand) {
console.error('copy unsupport');
return;
}
inputElem.select();
var result = document.execCommand('copy');
if(result) {
console.log('copy success');
} else {
console.error('copy fail');
}
});
注意事項
- 檢測當前環境是否支持命令API，這一步不可或缺。
- 瀏覽器環境不支持命令API，需要合理地提示用戶手動進行復制操作。所以，一定不能設置文本元素
user-select: none;，這樣會使文本不能被選擇。
- 表單元素必須處於被選中狀態，即調用
inputElement.select() 方法，文本元素沒有 select() 方法。
- 經測試，不能使用
display: none; 或 visibility: hidden; 來隱藏表單元素。所以，只能將此表單元素，定位至可以見區域之外。
- 必須表單元素有用，如果不是表單元素，建議新建input標簽，然后把val賦給input，在進行操作。需要靈活實現
更多方案
原文見：https://github.com/xiaoyucoding/ask/issues/3
