Copy Text To Clipboard with Single Click – Clipboard Button

Category: Javascript , Text | August 2, 2018
Views Total:4,552 views
Official Page:Go to website
Last Update:August 2, 2018


Copy Text To Clipboard with Single Click – Clipboard Button


Clipboard Button is a small JavaScript library which takes advantage of ClipboardEvent and Selection API to copy specified text into clipboard with a single click.

How to use it:

Include the core JavaScript file clipboard-button.js in your document.

<script src="clipboard-button.js"></script>

Create a ‘Copy to clipboard’ button and specify the text you want to copy using data-clipboard-text attribute.

<button id="myButton" data-clipboard-text="textToCopy">Copy</button>

Active the ‘Copy to clipboard’ button.

var cpb = clipboardButton('#myButton');

Pass the optional callback methods to the ‘Copy to clipboard’ button.

function success() {
function fail(err) {
  console.error('Error!', err);
var cpb = clipboardButton('#myButton', success, fail);

Destroy the ‘Copy to clipboard’ button.




  • Add support for multiline copy.

You Might Be Interested In:

One thought on “Copy Text To Clipboard with Single Click – Clipboard Button

  1. arnezt he (@arnezthe)

    Amazing… I find others copy to clipboard API more than 2 days and I found this great one. It’s support for bootstrap’s modal form.. I really love it. Thank you very much.


Leave a Reply