0

I'm fairly certain I've done this before, but I can't find any documentation about it. I'm finding this issue is oddly hard to research.

I'd like to display one version (A) of a bit of text on screen. However, when the text is copied, a different version of that text (B) is actually copied to the clipboard. In practice, A and B might be very similar, but the technique should allow for A and B to be completely different strings.

For example, if I use a <div> to display the following to the user:

<div>This is a really long...</div>

...and the user selects the div and issues a "copy" on it, I would like the text that is placed on the clipboard to be:

This is a really long bit of text that is too large to display on-screen, but should be fully intact when copy/pasted.

(Of course, my app would separately take care of shortening the first instance of the string and adding the ellipses.)

I seem to recall this being possible with simple HTML/CSS, but the details are eluding me... Thoughts?

rinogo
  • 7,068
  • 8
  • 54
  • 87
  • Couple of similar questions, might give something to work with: http://stackoverflow.com/questions/400212/how-do-i-copy-to-the-clipboard-in-javascript, http://stackoverflow.com/questions/17527870/how-does-trello-access-the-users-clipboard, http://stackoverflow.com/questions/8820445/javascript-clipboard-manipulation-after-section-has-been-copied-from-website – CBroe Mar 28 '15 at 01:21
  • 2
    On a personal side note – I’d be pissed at any site that did this. When I mark and copy something, then most of the times because I want to put it into a search engine, or paste it verbatim into some document I’m working with – getting something totally different there would be of no use to me, and I would feel “cheated” by a site that does this. (In a limited environment there might be legitimate uses cases for something like this though.) – CBroe Mar 28 '15 at 01:22
  • Thanks for your insight. I'm planning on using it on a backend that displays large amounts of data in a table. Some cells contain a *lot* of text that makes the rows incredibly tall (since there are so many wrapped lines in the cell). The idea is to display a preview of the text, but when the user copies the text, he/she gets the full version. Speaking of which, writing this comment reminds me - I think I might have solved this by using HTML/CSS to effectively "disable" the soft wrapping of the cell... – rinogo Mar 28 '15 at 01:31
  • **Of course, the best solution is to probably just provide a "copy to clipboard" button that copies the full, untrimmed data.** Regardless, I thought I'd ask, because I remembered having done something like this in the past. – rinogo Mar 28 '15 at 01:32
  • While I'm still interested in a possible answer to this question, the approach I ended up using (for the case described in the comments above) was: `table td { white-space: nowrap; max-width: 300px; overflow: hidden; }` – rinogo Mar 28 '15 at 01:45

0 Answers0