1. 程式人生 > >clipboard.js實現複製功能

clipboard.js實現複製功能

第一次在csdn上寫技術部落格,昨天剛修好家裡的電腦,閒來無事,試試這個配置極低的老機器是否能進行簡單的程式設計,閒話少敘,直入正題。

先上程式碼,js程式碼如下:

var clipboard = new Clipboard('p', {
        target: function() {
                   return document.querySelector('p');
              }
    });
    clipboard.on('success', function(e) {
        console.log(e);
        alert("複製成功");
    });

    clipboard.on('error', function(e) {
        console.log(e);
        alert("複製失敗");
    });

html程式碼如下:

<p data-clipboard-target="p">hello kitty</p>

實現的效果是點選p標籤的內容,複製p標籤的內容,關鍵的地方在於
1.呼叫clipboard.js
2.data-clipboard-target="p",複製對應標籤的內容
3.js第1行中p代表點選p標籤
4.js第3行p代表複製p標籤的內容