...

View Full Version : click image hotspot to copy text to clipboard



tpeck
03-28-2012, 02:32 PM
I have a small snippet of code which will copy the contents of a textbox to the clipboard when a small image, say a button, is clicked.

I want to achieve a similar effect when I click a hotspot on an image, but in this case the text will have to come from...well, I don't know. Maybe the title in an area tag?

This is what I have so far for a textbox:



//clipboard copy
function ClipBoard(what){
Copied = document.getElementById(what).createTextRange();
Copied.execCommand("Copy");
alert ("Information copied to the clipboard. Use CTRL-V to paste.");
}

<textarea id="holdtext1"></textarea> <img border="0" src="copyclick.gif" onclick="ClipBoard('holdtext1');" alt=" Click to copy text to clipboard / CTRL-V to paste" style="cursor: hand" width="18" height="18">


Does anyone have any ideas?

xelawho
03-28-2012, 04:03 PM
interesting. I haven't played around with execCommand that much (IE-only commands are kind of useless IMO), but it seems that one way is to pass the string with the onclick to the function, copy THAT text to a hidden textarea and then copy it FROM the textarea to the clipboard. There could easily a better way, though...



<body>
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Points_of_a_horse.jpg/800px-Points_of_a_horse.jpg" width="145" height="126" alt="horse" usemap="#horsemap" />
<map name="horsemap">
<area shape="rect" coords="0,0,82,126" href="#" onclick="ClipBoard('some text'); return false"/>
<area shape="circle" coords="90,58,3" href="#" onclick="ClipBoard('some other text'); return false"/>
<area shape="circle" coords="124,58,8" href="#" onclick="ClipBoard('even more text'); return false"/>
</map>
<textarea id="holdtext" style="display:none"></textarea>
<script type="text/javascript">
//clipboard copy
function ClipBoard(what){
document.getElementById("holdtext").value = what;
Copied = holdtext.createTextRange();
Copied.execCommand("Copy");
alert ("Information copied to the clipboard. Use CTRL-V to paste.");
}
</script >
</body>

tpeck
03-29-2012, 01:34 AM
Yes, that works - thanks - but as you say, only for IE.

There's some clever code called zeroclipboard which comes close to doing the same thing crossbrowser...

http://code.google.com/p/zeroclipboard/wiki/Instructions

...but there doesn't seem any way to get it to work on hotspots because the element is the entire image.

felgall
03-29-2012, 02:50 AM
There's some clever code called zeroclipboard which comes close to doing the same thing crossbrowser...

It actually requires Flash and so will not work for anyone who either doesn't have a recent enough version of Flash installed or who doesn't allow Flash to play automatically. Presumably it would also fail to work for anyone who has Flash configured to disallow access to the clipboard - since Flash shouldn't need that access and allowing it introduces all sorts of security issues.

tpeck
03-29-2012, 09:56 AM
The boffins at Stardock don't seem to think it's an issue - they do the very same thing when you download serial numbers from your account with them. Why the fear? Should we tell them they are risking WW3 with (shudder) flash?

http://aapress.com.au/demo/stardockflash.gif

felgall
03-29-2012, 07:23 PM
The boffins at Stardock don't seem to think it's an issue - they do the very same thing when you download serial numbers from your account with them. Why the fear? Should we tell them they are risking WW3 with (shudder) flash?


I was just pointing out that those who do consider it to be a security issue or who do not have flash would still be unable to use it. Also that malicious sites could offer it as a way to possibly get their viruses onto your system.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum