Use Javascript to Copy and Paste from the Clipboard

Description

A less used feature of JavaScript is to interact with the clipboard of the client computer. This page is intended to provide a demonstration of how to use JavaScript to copy and paste from the clipboard.

Browser Issues

Google Chrome

This no longer works in Google Chrome

Internet Explorer

If Internet Explorer is used as the client browser then you should be be prompted with this message when you first try to copy or paste.

Allow clipborad access screenshot

Once you allow access once on that particular page, then you should not be prompted during any subsequent copiers or pastes during that session.

Firefox

With firefox things are slightly more tricky as you need to install the AllowClipboard Helper extension. Once installed you need to add in the domain from which access will be allowed by going to the Tools menu and selecting AllowClipboard Helper.

Open about:config and ensure the value of signed.applets.codebase_principal_support is set to true

Update 25/09/2009 : Firefox 3.X does not appear to allow any access (http://support.mozilla.com/en-US/kb/Granting+JavaScript+access+to+the+clipboard). Any feedback/news on this is appreciated.

Further Uses and Ideas:

  • none at the moment

How it Works:

The guts of what is used on this page...


function pasteit(theField)
{
var editor = document.getElementById("ta1");
editor.focus();
editor.select();

document.execCommand('Paste');
}
function copyToClipboard(s)
{
var input = document.getElementById("ta1");
input.focus();
input.select();
document.execCommand('Copy');

if ( document.selection ) {
document.selection.empty();
} else if ( window.getSelection ) {
window.getSelection().removeAllRanges();
}
}

Relevant Links

clipboard.js - A modern approach to copy text to clipboard

Version History

Version 1 (25/03/2008)

Version 2 (20/06/2016) - Alternative Method removed

Comments For This Page

Paste doesn't work in my code in chrome on stack overflow code snippets.
On 22nd June 2017
Paste not working
On 26th February 2017
Paste is not working in chrome
By Athi on 26th December 2016
well, i dont have an IE
paste doesnt work on my firefox 47.0 and Chrome 53
i think it is for security reasons
By 2b on 18th August 2016
Thanx alot...work for me in IE10 to and IE11

function pasteit()
{
var editor = document.getElementById("ta1");
editor.focus();
document.execCommand('Paste');
}

function copyToClipboard()
{
var input = document.getElementById("ta1");
input.focus();
document.execCommand('Copy');
if ( document.selection ) {
document.selection.empty();
} else if ( window.getSelection ) {
window.getSelection().removeAllRanges();
}
}

On 25th June 2016
sandbox-javascript-to-copy-paste-clipboard.htm:267 Uncaught TypeError: val.createTextRange is not a function

chrome not run
On 19th June 2016
chrome not run
On 19th June 2016
works in ie firefox chrome opera. great work
On 1st October 2015
Thanks, works perfect in IE11.

Check your settings in IE => http://www.smartestcomputing.us.com/topic/67009-ie-11-copypaste-issue-has-been-fixed/

With Firefox it dosn't work...
By gzah on 31st July 2015
Firefox is getting worse than Microsoft. They want to tell people how they are allowed to work. I dropped IE for this very reason. Now Firefox is telling everyone "Resistance is futile." I say to Firefox, "Control is futile"
By Matrixcowboy on 27th July 2015
It works in Internet Explorer onely we want all borwsers
On 10th May 2015
this is not working in firefox, chrome or any other browers BECAUSE this code is WRONG, stupids comments
By XXX on 28th March 2015
this code not Run in chrome
By DS on 26th May 2014
not working in firefox
By xyz on 11th November 2013
Not Working
On 29th August 2013
Hi All, after the review, the description on this page is still correct. IE does allow access whereas firefox does not.
By Daft Logic on 2nd August 2013
it is only work in IE,
By Ravi on 23rd July 2013
@GOOGLE delete this useless link
On 19th July 2013
Not working
On 14th June 2013
window.clipboardData.getData
On 7th February 2013

20 out of 34 comments shown. See all comments.

Add your own comment below and let others know what you think: