Fire copy using javascript

Question

I have a html input. Using javascript & jQuery I can select the value of input. Now I want to fire a ctrl+c to copy that value in clipboard. I can use some plugins like zClip/zeroClip but this plugins uses flash which is not supported in all browsers. Is there any other option to copy that value in clip board?

The code should run in chrome, chromium, ff, opera & ie 10.

possible duplicate of [Copy to the clipboard in JavaScript?](http://stackoverflow.com/questions/400212/copy-to-the-clipboard-in-javascript) — urbz, Dec 18 '14 at 07:42
I've seen the question. But in that question the references are based on flash. And in my case my code should support all the browsers, so I can't use flash. — Indranil Mondal, Dec 18 '14 at 07:45

score 2 · Answer 1 · edited May 23 '17 at 12:16

2

It's not possible to achieve this using JavaScript (or based frameworks) due to security reasons. It can only be done using flash (for which you can use zeroclip etc.).

Also see:

edited May 23 '17 at 12:16

Community

1
1

answered Dec 18 '14 at 07:39

Chankey Pathak

21,187
12
85
133

score 2 · Accepted Answer · answered Sep 08 '15 at 21:57

2

<iframe src="https://cdn.rawgit.com/Triforcey/clip-j/38e8bf144e4633fffde57c675171b22211174e24/test.html" frameborder="0" width="100%" height="100%" style="margin: 0px;"></iframe>

This is possible, despite the many people who do not know about this solution. (It's very new.) I have created an extremely easy to use JavaScript library for this called clip-j. Here is the GitHub page. Basically how it works is it takes advantage of document.execCommand('copy'); with a few other lines of code to optimize it to get around the limitation that you need to be able to see the copied text. So this simple solution requires on no Flash, and is completely invisible! Here is the source code:

function clip(text) {
    var copyElement = document.createElement('input');
    copyElement.setAttribute('type', 'text');
    copyElement.setAttribute('value', text);
    copyElement = document.body.appendChild(copyElement);
    copyElement.select();
    document.execCommand('copy');
    copyElement.remove();
}

answered Sep 08 '15 at 21:57

Triforcey

453
5
10

As this function is very small, instead of adding the library I was using this code directly in the application. It's working in almost all browsers except safari. How I can fix it? – Indranil Mondal Oct 12 '15 at 08:22
I would recommend using zeroclipboard as a fallback for now, why there are still some browsers that lack support, they are working on it. – Triforcey Oct 12 '15 at 20:28
I saw the issue in safari. In some of the browser, it's throwing exceptions for the command document.execCommand('copy'), thus it's going to the cache block and showing the prompt. But in safari, it doesn't throw any error and thus no prompt is shown. So to solve it I've written var linkCopied = false; linkCopied = document.execCommand('copy'); And then in finally block if there is no error and the linkCopied is false, then shown the prompt. – Indranil Mondal Oct 14 '15 at 19:53
Cool. Do you mind if I update the library to do this? – Triforcey Oct 14 '15 at 20:52
Sure. That's why I told you the exact issue that I got. This my code: var link = "test copy", linkCopied = false, hasError; **Your code try { linkCopied = document.execCommand('copy'); } catch (e) { hasError = true; $(copyElement).remove(); prompt('..', link); } finally { if (!hasError) { $(copyElement).remove(); if (!linkCopied) { prompt('..', link); } } } You can also suggest me if I can modify my code somehow. – Indranil Mondal Oct 15 '15 at 20:48
I was also getting an error for copyElement.remove() in safari so wrapped it with $. You might need some other solution for that if you don't want jQuery for dependency. – Indranil Mondal Oct 15 '15 at 20:50

Fire copy using javascript

2 Answers2