Lightweight Copy To Clipboard Library – nanoclipboard

Category: Javascript , Text | June 19, 2016
Views Total:430 views
Official Page:Go to website
Last Update:June 19, 2016


Lightweight Copy To Clipboard Library – nanoclipboard


nanoclipboard is a lightweight and dependency-free JavaScript library which allows to copy any text to your local clipboard by one click.

How to use it:

Insert the JavaScript file nanoclipboard.js into your html page.

<script src="nanoclipboard.min.js"></script>

Create a button and define the content you want to copy using data-clipboard-text attribute:

<button id="btn" data-clipboard-text="" title="Copy Me!">Copy</button>

Initialize the nanoclipboard and done.

var clipboard = new NanoClipboard("#btn");

You can also copy text from any text field like input:

<input class="url" value=""></input>
<button id="btn" data-clipboard-selector=".url" title="Copy Me!">Copy</button>

Callback events.

clipboard.onSuccess = function(text) {
  alert("Copied: " + text)
clipboard.onError = function(text) {
  window.prompt("Ctrl+C: ", text);
  // this.unselect();


You Might Be Interested In:

Leave a Reply