如何使用clipboard.js或zeroclipboard複製div的內容？

-1

我在我的HTML中有一些div，我想複製一個div的內容，當我點擊該div。如何使用clipboard.js或zeroclipboard複製div的內容？

<div class="container">Hello</div> 
<div class="container">World</div> 
<div class="container">LearnJS</div>

所以當我點擊第一個div時，它會複製剪貼板上的「Hello」。

我搜索了這個網站，發現了一些zeroclipboard和clipboard.js，但我不知道如何使用它;我是jQuery的新手。

我該如何編寫一個函數來複制div的內部文本onclick？

來源

2015-10-22 victor

[複製沒有Flash到剪貼板]的可能的複製（http://stackoverflow.com/questions/6355300/copy-to-clipboard-without-flash） – blm

https://github.com/zeroclipboard/ jquery.zeroclipboard – epascarello

@victor相信用戶是基於你的帖子的內容進行投票的，他們只能在閱讀後才能知道。投票結束是爲該網站貢獻一段時間後獲得的特權;這些用戶基本上被信任在一個問題在別處被詢問和回答時做出正確的決定;您無需將粗體內容添加到您的問題中。 – TylerH

對不起，這裏有一個工作解決方案。只需將您的課程從「容器」更改爲「c」或其他任何內容以匹配下面的$（'。c'）選擇器（container是Bootstrap使用的類，這是一個非常流行的庫）。當您單擊其中一個DIV時，文本將被選中並複製到剪貼板。舊的瀏覽器將無法正常工作，順便說一句。

$(function() { 
    $('.c').on('click', function() { 
     SelectText($(this)[0]); 
     document.execCommand('copy'); 
    }); 

    function SelectText(element) { 
     var doc = document, range, selection; 
     if (doc.body.createTextRange) { 
      range = document.body.createTextRange(); 
      range.moveToElementText(element); 
      range.select(); 
     } else if (window.getSelection) { 
      selection = window.getSelection(); 
      range = document.createRange(); 
      range.selectNodeContents(element); 
      selection.removeAllRanges(); 
      selection.addRange(range); 
     } 
    } 
});

來源

2015-10-22 18:03:50

不工作，你可以給這個jsfiddle – victor

修正它作爲一個完整的例子。在加載jQuery之後，只需在腳本標記中添加HMTL即可。 –

https://jsfiddle.net/z50czLLw/ –

如何使用clipboard.js或zeroclipboard複製div的內容？

回答

相關問題