Copy/Put Text on the Clipboard with Firefox, Safari and Chrome

Copy / Put text on the clipboard with FireFox, Safari and Chrome

There is now a way to easily do this in most modern browsers using

document.execCommand('copy');

This will copy currently selected text. You can select a textArea or input field using

document.getElementById('myText').select();

To invisibly copy text you can quickly generate a textArea, modify the text in the box, select it, copy it, and then delete the textArea. In most cases this textArea wont even flash onto the screen.

For security reasons, browsers will only allow you copy if a user takes some kind of action (ie. clicking a button). One way to do this would be to add an onClick event to a html button that calls a method which copies the text.

A full example:

function copier(){  document.getElementById('myText').select();  document.execCommand('copy');}

<button onclick="copier()">Copy</button><textarea id="myText">Copy me PLEASE!!!</textarea>

Copy to clipboard with no Flash - Firefox, Chrome, Safari, Opera

There is no javascript method to do this - its prevented by browser security ... Flash is the best alternative ...

Explanation of security policy on Firefox -> http://kb.mozillazine.org/Granting_JavaScript_access_to_the_clipboard

Is it possible to read the clipboard in Firefox, Safari and Chrome using JavaScript?

Safari supports reading the clipboard during onpaste events:

Information

You want to do something like:

someDomNode.onpaste = function(e) {
    var paste = e.clipboardData && e.clipboardData.getData ?
        e.clipboardData.getData('text/plain') :                // Standard
        window.clipboardData && window.clipboardData.getData ?
        window.clipboardData.getData('Text') :                 // MS
        false;
    if(paste) {
        // ...
    }
};

Secret copy to clipboard JavaScript function in Chrome and Firefox?

I believe these are predefined Firebug console functions - at least that seems to be the case for Firebug. If you try calling window.copy for instance, you'll get a warning about function not defined, so it's definitely not a browser function, and cannot be used in normal JavaScript files. The following functions also seems to work in the JavaScript console, after playing around with it a bit:

• clear()
• profile()

---

Running these in the Chrome console reveals the source behind these functions in the Webkit console:

> profile
function ()
{
return console.profile.apply(console, arguments)
}

> clear
function ()
{
InjectedScriptHost.clearConsoleMessages();
}

> copy
function (object)
{
if (injectedScript._type(object) === "node")
object = object.outerHTML;
InjectedScriptHost.copyText(object);
}

While the Firebug source also defines a list of functions:

this.clear = function()  // no web page interaction
{
    Firebug.Console.clear(context);
};

this.inspect = function(obj, panelName)  // no web page interaction
{
    Firebug.chrome.select(obj, panelName);
};

this.keys = function(o)
{
    return FBL.keys(o);  // the object is from the page, unwrapped
};

this.values = function(o)
{
    return FBL.values(o); // the object is from the page, unwrapped
};

// etc...

copy to clipboard - not working in FF,Chrome

w3c clipboard api is been implemented by all the browser http://caniuse.com/#feat=clipboard

---

Related Topics