How to copy to Clipboard with a click? 1

javierdlm001 · Nov 13, 2017

Hi all,

Joe Burns shows here how to set up a button that when clicked, you get whatever text was being host in its code, copied to your Clipboard. Hence you could paste it somewhere.
Apparently it no longer works with modern browsers due to security reasons.
Does anyone know of an alternative?
Thanks guys!

JDL

spamjim · Nov 13, 2017

https://davidwalsh.name/clipboard

javierdlm001 · Nov 13, 2017

This is great!

Thanks a bunch spamjim

JDL

javierdlm001 · Nov 14, 2017

Now that I had a closer look, I could use a bit of clarification

I understand that "Copying and Cutting Values of Textarea and Input" & "Copying Element innerHTML" go in the <body> tag.
But what about "Target and Text Functions" & "Events" ? Do I need a <script> tag for these? If so, does it go in the <head> tag, or in the <body>?

Thanks in advance

javierdlm001 · Nov 15, 2017

In another words...

Where am I to put this below:

Target and Text Functions
// Contents of an element
var clipboard = new Clipboard('.copy-button', {
target: function() {
return document.querySelector('#copy-target');
}
});

// A specific string
var clipboard = new Clipboard('.copy-button', {
text: function() {
return 'clipboard.js is awesome!';
}
});

Events
var clipboard = new Clipboard('.btn');

clipboard.on('success', function(e) {
console.log(e);
});

clipboard.on('error', function(e) {
console.log(e);
});

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

How to copy to Clipboard with a click? 1

javierdlm001

Technical User

spamjim

Instructor

javierdlm001

Technical User

javierdlm001

Technical User

javierdlm001

Technical User

Similar threads

Part and Inventory Search

Sponsor