Timeline for Click button copy to clipboard
Current License: CC BY-SA 4.0
52 events
| when toggle format | what | by | license | comment | |
|---|---|---|---|---|---|
| Mar 15, 2025 at 21:37 | comment | added | Hubbitus | This comment is very good and detailed. Meantime, I've also start using it and found what new API mostly works, but not on Android devices... To do not implement tons of polyfills and account quirks, I would like to use something like clipboardjs.com! That is small and awesome lib with ~34k stars (at writing comment)! | |
| Oct 6, 2022 at 9:14 | comment | added | Ali Samie | It did not work for me in firefox | |
| Mar 28, 2021 at 20:04 | comment | added | Amir Hossein Abdollahi |
I use $(this).append($temp) instead of $("body").append($temp), because the original method does not work on modals (chrome).
|
|
| Feb 6, 2021 at 22:38 | comment | added | fdrv | Uncaught Error: Syntax error, unrecognized expression | |
| Dec 11, 2020 at 20:28 | comment | added | Jon Fergus | I'm using the jquery code you gave for keeping the html formatting, and using it in wordpress, but the .focus() is causing it to scroll to the bottom of the page on click. Do you know how to stop that? | |
| Nov 13, 2020 at 20:35 | comment | added | Arvy | No reason to name the variable as $temp, looks confuse when use jQuery. Just use "temp", since $ is mostly related to jQuery. | |
| Aug 23, 2020 at 4:06 | history | edited | Ehsan88 | CC BY-SA 4.0 |
trim the whitespaces of the text
|
| Jun 6, 2020 at 19:58 | history | edited | Alvaro Montoro | CC BY-SA 4.0 |
add note about obsolescence
|
| Jul 10, 2019 at 10:11 | history | edited | Popnoodles | CC BY-SA 4.0 |
Expected semicolon
|
| Dec 20, 2017 at 15:11 | comment | added | Krisztián Balla | Good news. I found a solution for the problem. Please see the answer to the question I've just linked to. | |
| Dec 20, 2017 at 13:55 | comment | added | Krisztián Balla | Unfortunately the workaround with the contenteditable div is no longer working in Internet Explorer version 11.125.16299.0 (Updateversion: 11.0.49 - KB4052978). I tried it on several computers. :-( I created a separate question for this here: stackoverflow.com/questions/47907503/… | |
| Nov 17, 2017 at 11:43 | comment | added | Krisztián Balla | Could it be that Edge copies the content of the entire page, instead of only the content from the div to the clipboard? I also tried the solution suggested here: stackoverflow.com/questions/12243898/… but it has the same effect. | |
| Nov 6, 2017 at 17:45 | comment | added | Alvaro Montoro | @JennyO'Reilly Thanks for the feedback. I'll check it later today and check what's wrong. | |
| Jul 6, 2017 at 14:00 | history | edited | Alvaro Montoro | CC BY-SA 3.0 |
Demo with jQuery for keeping style + update on supported browsers
|
| Jul 6, 2017 at 11:00 | comment | added | Gwyneth Llewelyn | All right, works like a charm, and I agree, this should be used as the correct answer. I'm also using a TEXTAREA because in my case (I have code snippets) I need the lines to be broken correctly. Nice work, though, this is exactly what I wanted! I'm probably going to add a popup or something to give feedback on the copy, but that's beyond the scope of this answer. Thank you a lot! | |
| Jun 20, 2017 at 12:22 | comment | added | Accountant م |
Thanks, you saved me a lot of time. I used the code in the "COPY KEEPING THE TEXT FORMAT" part and it worked with me except I had to copy the outterHTML of the element not the innerHTML so elements like '<table>' should be copied also with it's '<table>' wrapper, not to start the copy from it's innerHTML '<thead>'
|
|
| Jun 10, 2017 at 14:23 | comment | added | Alvaro Montoro | @thomasfuchs I added a fix for that in an edit for vanilla JS but forgot jQuery. I need to update the jQuery version. Thanks for pointing it out | |
| Jun 10, 2017 at 14:20 | comment | added | thomasfuchs | The original jQuery implementation fails to preserve line breaks, because it is using an INPUT element. Using a TEXTAREA instead solves this. | |
| May 23, 2017 at 11:55 | history | edited | URL Rewriter Bot |
replaced http://stackoverflow.com/ with https://stackoverflow.com/
|
|
| Apr 20, 2017 at 17:29 | history | edited | Alvaro Montoro | CC BY-SA 3.0 |
added a version that keeps text rich format
|
| Mar 26, 2017 at 16:44 | comment | added | user2868864 | Does this work on firefox 52? I tried both versions to copy to clipboard on a span id and I am unable to get the text for copy using this. Are there any tweaks? | |
| Sep 8, 2016 at 13:21 | history | bounty awarded | Community Bot | ||
| Jul 28, 2016 at 23:20 | comment | added | molerat | I have a long table of students and you can click a button in each row that copies data into your clipboard. Every time I do that, the browser scrolls to the bottom of the page. Is there a way to avoid this? | |
| Jul 28, 2016 at 23:17 | comment | added | molerat | Works fine, thank you! It is important to mention that this works only immediately on certain events (e.g. click). I tried to run that code in an ajax-callback and it wouldn't work. | |
| Jul 11, 2016 at 14:30 | history | edited | Gabriel GM | CC BY-SA 3.0 |
Corrected code sample.
|
| Feb 15, 2016 at 15:10 | comment | added | user3047190 | I think it would be better to use <textarea> than <input> as <textarea> supports multiline | |
| Jan 18, 2016 at 9:38 | history | bounty awarded | Sinister Beard | ||
| Jan 15, 2016 at 19:35 | comment | added | Alvaro Montoro | @jfriend00 No, I haven't found solution for Safari. | |
| Jan 15, 2016 at 18:03 | comment | added | jfriend00 | Have you found any way to make the copy to clipboard work in Safari yet? | |
| Jan 15, 2016 at 12:32 | comment | added | Sinister Beard | This should be the accepted answer, surely? The current accepted answer is (an extended and well explained) "nope", but this shows it actually can be done, and in only a few lines of js. | |
| Oct 21, 2015 at 3:02 | comment | added | c00000fd |
It's a good answer, just want to add that there's no guarantee that document.execCommand() will return false or throw an exception if copying is not allowed. For instance, I'm testing it on IE11 and if I disallow copying (from its security UI) the method still returns true even though nothing is copied to the clipboard.
|
|
| Oct 7, 2015 at 21:08 | history | edited | Alvaro Montoro | CC BY-SA 3.0 |
Removed comment about Firefox availability. The code works fine on FF now.
|
| Oct 7, 2015 at 20:01 | comment | added | ariscris | Both IE 11 and Chrome 45. The snippet here works, it's something specific to our app. | |
| Oct 7, 2015 at 18:24 | comment | added | Alvaro Montoro | @ariscris what browser are you using when you get those errors? | |
| Oct 7, 2015 at 18:15 | comment | added | ariscris |
This didn't work for me until I made sure that aux was visible on the page by adding the following lines: aux.style.position = "fixed"; aux.style.top = 0; above the appendChild call.
|
|
| Sep 27, 2015 at 11:17 | history | edited | Peter Mortensen | CC BY-SA 3.0 |
Copy edited. Removed historical information (e.g. ref. <http://meta.stackexchange.com/a/230693> and <http://meta.stackoverflow.com/questions/266164>).
|
| Aug 10, 2015 at 13:20 | history | edited | Alvaro Montoro | CC BY-SA 3.0 |
added 173 characters in body
|
| Aug 10, 2015 at 13:14 | history | edited | Alvaro Montoro | CC BY-SA 3.0 |
Updated jQuery solution with suggestion from PointZeroTwo, and removed unnecessary code in the JavaScript-only solution
|
| Jul 27, 2015 at 17:59 | comment | added | PointZeroTwo | The jquery version can be improved slightly to not use a "#temp" id, which could conflict with something else on the page. Start by creating the temporary input object with: var $temp = $("<input />");, then append $temp to the page, and call $temp.remove() to remove it. See jsfiddle.net/tvkrdjs8/1 (also includes some error handling around execCommand). | |
| Jul 27, 2015 at 17:41 | comment | added | PointZeroTwo | FWIW - document.execCommand("copy") returns a boolean (IE, Chrome, Safari) indicating whether the copy was successful. It could be used to display an error message on failure. Firefox throws an exception on failure (in v39 at least), requiring a try/catch to handle the error. | |
| Jun 26, 2015 at 2:40 | history | edited | Alvaro Montoro | CC BY-SA 3.0 |
added 200 characters in body
|
| Jun 25, 2015 at 16:50 | comment | added | Alvaro Montoro | Let us continue this discussion in chat. | |
| Jun 25, 2015 at 16:46 | comment | added | madzohan | thanks, but anyway it doesn't work :D works only in chain document.execCommand("SelectAll"); document.execCommand("Copy"); maybe you know how to select window.location.href without any temp manipulations? | |
| Jun 25, 2015 at 16:36 | history | edited | Alvaro Montoro | CC BY-SA 3.0 |
added 1631 characters in body
|
| Jun 25, 2015 at 16:30 | comment | added | Alvaro Montoro | @madzohan Ok, I was able to reproduce the issue. It is weird because I was only able to reproduce it on local (file://) on 64-bit Chrome. I also found a quick solution that works for me: using plain JavaScript instead of jQuery. I will update the answer with that code. Please check it and let me know if it works for you. | |
| Jun 25, 2015 at 16:09 | comment | added | madzohan | nope it doesn't work ... looking for another way to select | |
| Jun 25, 2015 at 15:56 | comment | added | Alvaro Montoro |
This is strange. Does it work if you assign it a string instead of doing $('body').text()?
|
|
| Jun 25, 2015 at 15:47 | comment | added | madzohan | nope it is only one (after remove() $('#temp') -> nothing) | |
| Jun 25, 2015 at 15:43 | comment | added | madzohan | seems select() problem because document.execCommand("copy") works after selecting some text on page manually | |
| Jun 25, 2015 at 15:41 | comment | added | madzohan | I've removed $("#temp").remove(); and perform in console (after copyToClipboard triggered) $("#temp").val($('body').text()).select(); > [<input type="text" id="temp" style="position:absolute;opacity:0;">] document.execCommand("copy"); > false | |
| Jun 25, 2015 at 15:01 | comment | added | madzohan | strange ... here it works, but I cannot get to work it locally 0o jquery-1.11.3 Chrome 43.0.2357.130 (64-bit) | |
| Jun 18, 2015 at 1:56 | history | answered | Alvaro Montoro | CC BY-SA 3.0 |