This a small JS library to execute clipboard functions in a fast and easy way.
Github repository: https://github.com/assisfery/CopyPasteJS
CDN repository: https://www.jsdelivr.com/package/gh/assisfery/CopyPasteJS
NPM repository: https://www.npmjs.com/package/copypastejs
Just import the src/CopyPasteJS.js file in your document.
<script src="src/CopyPasteJS.js"></script>
This file is hosted in CDN JSDelivr.
<script src="https://cdn.jsdelivr.net/gh/assisfery/CopyPasteJS@1.2/src/CopyPasteJS.min.js"></script>
Or you can get it using NPM repository.
npm i copypastejs
To copy data from a input element just add data-copy-origin="#element" attribute to the button.
<button class="btn btn-success" data-copy-origin="#txtCopy">Copy</button>
To copy text to clipboard data-copy-text="text" attribute to the button.
<button class="btn btn-success" data-copy-text="Some text">Copy</button>
To copy text to clipboard from a html element just include data-copy-origin="#element" attribute to the button.
<button class="btn btn-success" data-copy-origin="#element">Copy</button>
Text copied from a p element.
To paste data to a input element just add data-paste-target="#element" attribute to the button.
<button class="btn btn-success" data-paste-target="#txtPaste">Paste</button>
To cut data from a input element just add data-cut-origin="#element" attribute to the button.
<button class="btn btn-success" data-cut-origin="#txtCut">Cut</button>
To copy and paste data from a input element to another just add data-copy-origin="#element" and data-paste-target="#element" attributes to the button.
<button class="btn btn-success" data-copy-origin="#txtCopy2" data-paste-target="#txtPaste2">Copy and Paste</button>
After data is been copied if you want to execute a function just add data-copy-callback="jscode()" attribute to the button.
<button class="btn btn-success" data-copy-origin="#txtCopy3" data-copy-callback="alert('copied')">Copy and Callback</button>
After data is been pasted if you want to execute a function just add data-paste-callback="jscode()" attribute to the button.
<button class="btn btn-success" data-paste-target="#txtPaste3" data-paste-callback="alert('pasted')">Paste and Callback</button>
You can do all those actions in JavaScript code.
CopyPasteJS.copyText("Text copied in JS");
CopyPasteJS.copyText("Text copied in JS and Callback triggered", function(){ alert("Yes its done"); });
CopyPasteJS.copyFrom("#txtCopy4"); // OR USE CALLBACK CopyPasteJS.copyFrom("#txtCopy4", function(){ alert(123); });
CopyPasteJS.pasteTo("#txtPaste4"); // OR CALL A FUNCTION CopyPasteJS.pasteTo("#txtPaste4", function(){ alert("I fell amazing"); });
CopyPasteJS.cutFrom("#txtCut2"); // OR CALL A FUNCTION CopyPasteJS.cutFrom("#txtCut2", function(){ alert("I fell amazing"); });