頁面上點選按鈕實現複製功能
阿新 • • 發佈:2019-01-01
引入clipboard.js;
htm程式碼:
<p class="link-div-p1">優惠券連結:<span id="link-span">http://</span></p> <!--<span style="font-family:蘿莉體;font-size:medium;color: #0a0a0a"></span>--> <!--<button type="button" onclick="closeDiv()">關閉</button>--> <p class="link-div-p2"> <button class="btn" data-clipboard-action="copy" data-clipboard-target="#link-span" type="button" onclick="copyLink()">複製</button></p>
js程式碼:
function copyLink(){ var spanValue = ""+$(".link-div-p1").children("span").eq(0).text(); if(window.clipboardData){//若果瀏覽器支援這個功能 window.clipboardData.setData("Text",spanValue);//執行瀏覽器複製命令 }else{ var clipboard = new Clipboard('.btn'); clipboard.on('success',function(e){ console.info('Action:', e.action); console.info('Text:', e.text); console.info('Trigger:', e.trigger); e.clearSelection(); }); clipboard.on("error",function(e){ console.error('Action:', e.action); console.error('Trigger:', e.trigger); }); } }
這個js的詳細使用 來自簡書網友