Clipboard Copy
In the past I’ve wondered if it was possible to make a cross-browser (JavaScript) script that a webpage could execute to copy some text to the windows clipboard. Would be handy and would save the user from pulling the whole CTRL+C trick out.
It was pretty easy to do with Internet Explorer with the code below… but we all don’t use IE.
holdtext.innerText = copytext.innerText;
Copied = holdtext.createTextRange();
Copied.execCommand("Copy");
Credit to Mark O’Sullivan of http://lussumo.com/ since he has a solution for this problem. In his file browser / photo gallery application, there is a link to copy the URL of the file to the clipboard… works in both Firefox and IE (I also checked in Opera 8.5 and it didn’t seem to work).
Here is the solution implemented in a javascript function:
Update: I have updated the copy() function in the script to use encodeURIComponent() instead of escape() which will allow use of ‘+’ to be copied as well.
function copy(inElement) {
if (inElement.createTextRange) {
var range = inElement.createTextRange();
if (range && BodyLoaded==1)
range.execCommand('Copy');
} else {
var flashcopier = 'flashcopier';
if(!document.getElementById(flashcopier)) {
var divholder = document.createElement('div');
divholder.id = flashcopier;
document.body.appendChild(divholder);
}
document.getElementById(flashcopier).innerHTML = '';
var divinfo = '<embed src="_clipboard.swf" FlashVars="clipboard='+encodeURIComponent(inElement.value)+'" width="0" height="0" type="application/x-shockwave-flash"></embed>';
document.getElementById(flashcopier).innerHTML = divinfo;
}
}
Pretty slick I’d say, he’s using a Macromedia Flash file to perform the copy on the Browser’s behalf (since Firefox/Netscape’s security settings do not allow access to the clipboard by default).
I’ve uploaded the SWF file that you can use in your own webpage.
This software is licensed under the GPL so you can take this solution, change it, whatever, free.
October 1st, 2007 at 12:48pm
Beautiful. Thanks for all the work on this!…Do you know how I could take the clipboard contents and define it to a variable in php? I’d like to send an email that includes the contents of the textarea that has been copied and need to $_POST to another php file. Thanks!
October 5th, 2007 at 5:43am
Perfect Solution – very cool :)
But how can i paste the clipboard in firefox with Javascript (get the content of the clipboard).
October 12th, 2007 at 4:31am
CAN ANY GENIUS PEOPLE OUT THERE MAKE THIS WORK FOR OPERA AND IE7 .. I am a dummie so i cant be of much help…other than using the code u guys give me . but plsssss help . i want this badly or i will loose a big bet with my gf .
October 19th, 2007 at 4:59am
Hi Jeffrey,
I found your post after trying to solve the + sign problem. I’ve tweaked my own code to use encodeURIComponent – and the + sign is encoded properly – but when it’s pasted out of the clipboard, it’s set as %2B.
I’ve tried it using the _clipboard.swf you’ve provided out of an empty cache and I still get the %2B. Does this definitely work, or can you possibly send me the source to the SWF so I can have a go at debugging it?
Cheers.
October 19th, 2007 at 7:37am
Hi Remy,
Unfortunately I don’t have the source of the SWF to give you, as I stated in the blog post you commented on, Mark O’Sullivan of http://lussumo.com/ is where I found this solution. Maybe try contacting him?
Let me know if you get anywhere.
Jeffrey.
October 23rd, 2007 at 6:45am
For ExtJs users also usefull info.
http://extjs.com/forum/showthread.php?p=73084
October 25th, 2007 at 10:29am
Hi Jeffrey
Did you find a way how to pass line breaks (\n) in the textarea-field to the flash?
When I have textarea with multiple lines and I use this function and then copy the contents of the clipboard into notepad i get a multi-line output with IE but with Firefox all the linebreaks get replaced by squares.
October 25th, 2007 at 10:35am
i think i just found it out myself…. replaced the encodeURIComponent by this function
function escape_breaks(str) {
str = encodeURIComponent(str);
var newstring = str.replace(/%0A/g, “%0D%0A”);
return newstring;
}
October 28th, 2007 at 3:27am
???????????…
?IE????????????????????????????????IE??????????????Firefox?Opera?Safari???????????Javascript????
???Google????…
October 29th, 2007 at 2:55pm
[...] Jeffothy provides us with swf (right-click, save link as) to use when copying to the clipboard. [...]
November 9th, 2007 at 6:10am
Working great, but if I copy HTML code it is transformed (escaped).
How do I copy plain HTML instead of getting this:
;<a href="http://www.domain.com">
November 9th, 2007 at 9:12am
[...] http://www.jeffothy.com/weblog/clipboard-copy/ [...]
November 9th, 2007 at 9:13am
wOw…. i really thank you…. you saved my life….
November 13th, 2007 at 2:00pm
Great!!!!! How can I make it work for multiple texts as working in this IE version? http://www.codingforums.com/archive/index.php?t-8911.html
November 13th, 2007 at 2:12pm
great! how can i make it work for multiple texts & links as working in this IE version?
http://www.codingforums.com/archive/index.php?t-8911.html
maybe combine that with this flash version?
November 15th, 2007 at 12:32pm
Great! Is it possible to have multiple copy links?
It was realized in this script (IE only) http://www.codingforums.com/archive/index.php?t-8911.html
November 16th, 2007 at 9:24am
If part of a software project is under GPL, all of it has to be. In other words, you can’t release the JS code GPL’ed and then have the required SWF component not be GPL. That would violate the GPL Liscence.
November 16th, 2007 at 9:26am
STFI
November 17th, 2007 at 1:42am
Thank You!
It works like a charm :)
November 26th, 2007 at 9:49pm
[...] 2. Using a flash file that passes the copied text to the flash file via the flashvars property. [See] [...]
November 27th, 2007 at 12:48am
I found a way to get around the special html characters issue that seems to occur using this method. I’ve written up a brief explanation here: http://forboden.com/2007/11/27/copy-to-clipboard-in-firefox-without-escaping-characters/
November 30th, 2007 at 4:41am
Hey Jeff – great work man!
Did you ever managet to find a solution for pasting FROM clipboard into browsers?
Cheers,
Adrian
December 3rd, 2007 at 5:34am
[...] to Jeffothy for the original DHTML solution of using encodeURIComponent() I updated this somewhat and made it write the myspace tag to a hidden [...]
December 3rd, 2007 at 9:22am
We have improved the system so it can be called within a JavaScript function (and thus AJAX).
You can download it from here (the link is “Cliquez ici pour télécharger notre version”).
You just need to use copy(”Whatever you want”) from any script. Shall you need carriage return, add “\n” (without quotes) to your string.
January 8th, 2008 at 6:43pm
Thank you very much. This saved me a lot of time!
January 10th, 2008 at 7:27pm
Thank you very very very much ^Q^
January 18th, 2008 at 4:49am
[...] however, allows developers to freely copy the text to the clipboard. Jeffrey Larson came up with the solution using a really small swf file from his Javascript [...]
January 20th, 2008 at 4:24pm
I like this script it’s awesome but I have one question… Right now I don’t feel like there is any indication to the user that the text in the textarea has been copied. Is there a way I can say “copied” next to the button or smthg? This might be a very stupid question but I’m not that good with this stuff!
January 21st, 2008 at 2:06pm
Great!!! Thank you!
February 10th, 2008 at 12:01am
[...] Copy arbitrary text to clipboard, via flash [...]
February 15th, 2008 at 10:48am
Brilliant!
Only problem is that some charactors don’t copy properly such as + and % but I’m sure you already know that!
Very useful tool!
February 16th, 2008 at 5:46pm
[...] 2. Using a flash file that passes the copied text to the flash file via the flashvars property. [See] [...]
February 22nd, 2008 at 5:06am
great!!!
It can support Chinese when use encodeURIComponent() replace to escape() .
February 28th, 2008 at 4:45pm
Is there a final version of this copy script that works in both FireFox and IE?
Also I don’t understand what the swf file does… Can some one explain this. I have tried several ways to get this to work in “Edit Plus” but it only seams to work with IE.. Am I doing something wrong?
March 14th, 2008 at 6:38pm
This is fine.
But I want pure clean code.
As a developer/webmaster, you can’t expect everyone to have Flash installed at their computers.
Theres got to be another way out of this . . .
March 26th, 2008 at 4:33pm
Thanks a bunch. I’ve been looking for one of these for ages since I saw it on photobucket. Even though this post is 3 years old
April 1st, 2008 at 4:05am
Just wondering if anyone knows if its possible to copy formatted text to the clipboard, rather than the HTML. I’ve tried this code and it works great on a DIV I need to copy. However, its copying the HTML, which is not what happens when a user highlights text and copies it (that would grab a formatted chunk of text which someone could put straight into Word etc). Is this even possible?
April 11th, 2008 at 2:35am
Hey,
im wondering, how can i call “copy” if i want to copy the url?
I’ve tried using javascript:copy(document.location.href) but with no luck
April 11th, 2008 at 2:41am
how can i copy my current url with this?
April 16th, 2008 at 10:41pm
Great work! I’m using a modified, slightly simplified version of this on LinkBunch, a multiple link grouping utility, and Lincr, a simple URL shortening service. Thanks for this!
April 17th, 2008 at 8:02pm
Is it possible to get a “copy selected text” script instead of a “copy all text” like this one. BTW it works fine in Firefox 2.0.0.11 Thank you!
May 8th, 2008 at 8:49am
[...] Fonte: Clipboard Copy. [...]
May 9th, 2008 at 2:48am
Jeffrey
Firstly thanks for the script.
There is an error in the revised script that you have posted to get around the +* problem of javascipt escape().
The scripts does NOT work with the line encodeURIComponent(inElement.value)
It works only when it is changed to encodeURIComponent(inElement)
May 11th, 2008 at 4:13am
[...] ??????Jeffothy’s Keyings??Clipboard Copy?firefox???????flash?????copy????????? [...]
May 11th, 2008 at 4:48am
[...] ?Firefox???????????firefox?????????????ie?????????????????????????????????????????????Firefox??????????????????????Clipboard Copy?????firefox?“??????”? [...]
May 14th, 2008 at 2:57am
[...] is very nice to share his copy to clipboard script on his blog for free! Installing the javascript is simple – upload the .js file and the .swf file [...]
September 10th, 2008 at 2:24pm
Very useful tool – works on OS X too. Thank you so much for sharing this!
September 10th, 2008 at 10:11pm
Can you release a version of the SWF movie that takes in HTML (ClipboardFormats.HTML_FORMAT). If I use the component as it is right now and paste into Word it pastes the HTML as a string which is not user-frienly.
Thanks in advance!
September 26th, 2008 at 11:45am
Sorry to be a party-breaker, but with the update to Flash Player 10 this great method will unfortunately stop working since the Flash security model has been tightened.
October 15th, 2008 at 8:47pm
There’re some security changes in Flash Player 10, and this trick is no longer available. Can you give some updates about this swf file? Sorry that I don’t know more about Flash…
Thanks Jeffothy!