如何使用 clipboard.js 或 zeroclipboard 复制 div 的内容？

Question

我的 HTML 中有一些 div，我想在单击 div 时复制 div 的内容。

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

所以当我点击第一个 div 时，它会复制剪贴板上的 "Hello"。

我搜索了这个网站，找到了一些 zeroclipboard 和 clipboard.js，但我不知道如何使用它；我是 jQuery.

的新手

我如何编写一个函数来复制 div 的内部文本 onclick？

Answer 1

抱歉，这是一个可行的解决方案。只需将 class 从 "container" 更改为 "c" 或任何其他内容以匹配下面的 $('.c') 选择器（container 是 class 使用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);
        }
    }
});

如何使用 clipboard.js 或 zeroclipboard 复制 div 的内容？

How to copy a div's content with clipboard.js or zeroclipboard?

javascript

clipboard

jquery

zeroclipboard

clipboard.js