Copy Text To Clipboard with Single Click – Clipboard Button

Preview:

Description:

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() {
  console.log('Copied!');
};
function fail(err) {
  console.error('Error!', err);
};
var cpb = clipboardButton('#myButton', success, fail);

Destroy the ‘Copy to clipboard’ button.

cpb.destroy().

Changelog:

08/02/2018

• Add support for multiline copy.