Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to copy text from div to Clipboard in JS

I'm trying to use zeroclipboard 2.2.0.

<!DOCTYPE html>
<html>
<head lang="en">
    <script src="bower_components/zeroclipboard/dist/ZeroClipboard.js"></script>
</head>
<body>

<div id="first">1111111</div>
<div id="second">2222222222</div>

<button id="d_clip_button" class="my_clip_button" data-clipboard-target="first">Copy from first div</button>
<button data-clipboard-target="second">Copy from second div</button>
</body>
</html>

But it is not working for me. Could you point at mistake? I cannot find proper examples because they are quite oudated.

If you can suggest any alternative to zeroclipboard I will consider it.

like image 312
Taras Hupalo Avatar asked Jan 23 '26 21:01

Taras Hupalo


1 Answers

This works for me:

<div id="first">1111111</div>
<div id="second">2222222222</div>

<button id="button1" data-clipboard-target="first">Copy from first div</button>
<button id="button2" data-clipboard-target="second">Copy from second div</button>

<script>
    var zeroClipboard = new ZeroClipboard();
    zeroClipboard.clip(document.querySelector("#button1"));
    zeroClipboard.clip(document.querySelector("#button2"));

    zeroClipboard.on('copy', function(event) {

    });
</script>
like image 176
Taras Hupalo Avatar answered Jan 26 '26 13:01

Taras Hupalo