1. 程式人生 > >clipboard.js實現手機端/H5複製

clipboard.js實現手機端/H5複製

第一步引入js檔案

第二步id的一致性

第三步實現程式碼

//init
var clipboard = new ClipboardJS('.copyUrlBtn');
//優雅降級:safari 版本號>=10,提示覆製成功;否則提示需在文字選中後,手動選擇“拷貝”進行復制
clipboard.on('success', function(e) {
	 alert('複製成功!')
	 e.clearSelection();
});
clipboard.on('error', function(e) {
	alert('請選擇“拷貝”進行復制!')
}); 

 注意採坑: 1.

var clipboard = new Clipboard('#codeBtn');

然後控制檯會報錯  Uncaught TypeError: Illegal constructor

v2.0 以後不能用這個方法例項化了,必須給後面加個大寫的JS

2.第二個就是 clipboard.min.js:7 Uncaught DOMException: Failed to execute 'setSelectionRange' on 'HTMLInputElement': The input element's type ('hidden') does not support selection. 

不支援隱藏的ipnut屬性,這樣clipboard是取不到值的