Copy Text To Clipboard with Single Click – Clipboard Button

Category: Javascript , Text | August 2, 2018
Author:omichelsen
Views Total:3,922 views
Official Page:Go to website
Last Update:August 2, 2018
License:MIT

Preview:

Copy Text To Clipboard with Single Click – Clipboard Button

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.

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.

    Reply

Leave a Reply