Copy images and text to clipboard

[Risto Heinonen]

Hi.

I have a web page that has images and text. I can carefully select one
image and the on the right of the image and then copy & paste to Word.

Is it possible to make javascript do the same: select the same area
(divided by <div> tag) and copy to clipboard?

So far I succeeded to make the script to copy the area inside <div> but
it was plain html-text.

The idea is to have tha data in clipboard so one can paste it to Word
remaining the layout like it is in html-file.
Here's what I have now in my html-file:

....
<script>
function copyToClipboard()
{
var x=document.getElementById('copythis');
document.form.copyArea.value=x.innerHTML;
y = document.form.copyArea.createTextRange();
y.select();
y.execCommand("Copy");
}
</script>

....

<div id="copythis">
.... image and text in html-table to be copied to clipboard ...
</div>

....

<form name="form">
<input type="button" name="copy" value="Copy to clipboard"
onClick="copyToClipboard()">
<input type="hidden" name="copyArea" value>
</form>

....
Any help is appreciated.

- Risto

[Risto Heinonen]

> Hi.

I have a web page that has images and text. I can carefully select one
image and the on the right of the image and then copy & paste to Word.

Is it possible to make javascript do the same: select the same area
(divided by <div> tag) and copy to clipboard?

So far I succeeded to make the script to copy the area inside <div> but
it was plain html-text.

The idea is to have tha data in clipboard so one can paste it to Word
remaining the layout like it is in html-file.
Here's what I have now in my html-file:

...
<script>
function copyToClipboard()
{
var x=document.getElementById('copythis');
document.form.copyArea.value=x.innerHTML;
y = document.form.copyArea.createTextRange();
y.select();
y.execCommand("Copy");
}
</script>

...

<div id="copythis">
... image and text in html-table to be copied to clipboard ...
</div>

...

<form name="form">
<input type="button" name="copy" value="Copy to clipboard"
onClick="copyToClipboard()">
<input type="hidden" name="copyArea" value>
</form>

...
Any help is appreciated.

- Risto

Please let me know if this is impossible to do with JS.

[Evertjan.]

Risto Heinonen wrote on 10 sep 2004 in comp.lang.javascript:

I have a web page that has images and text. I can carefully select one
image and the on the right of the image and then copy & paste to Word.

Is it possible to make javascript do the same: select the same area
(divided by <div> tag) and copy to clipboard?

Please let me know if this is impossible to do with JS.

It is impossible to proove that it is.

I think so anyway.
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress,
but let us keep the discussions in the newsgroup)

[Martin Honnen]

Risto Heinonen wrote:

I have a web page that has images and text. I can carefully select one
image and the on the right of the image and then copy & paste to Word.

Is it possible to make javascript do the same: select the same area
(divided by <div> tag) and copy to clipboard?

With IE 5.5/6 on Win you can try it as follows:
var div = document.getElementById('divId');
div.contentEditable = 'true';
var controlRange;
if (document.body.createControlRange) {
controlRange = document.body.createControlRange();
controlRange.addElement(div);
controlRange.execCommand('Copy');
}
div.contentEditable = 'false';

Then you should be able to paste the clipboard content into Word.

--

Martin Honnen
http://JavaScript.FAQTs.com/

[Risto Heinonen]

>> I have a web page that has images and text. I can carefully select one

image and the on the right of the image and then copy & paste to Word.

Is it possible to make javascript do the same: select the same area
(divided by <div> tag) and copy to clipboard?

With IE 5.5/6 on Win you can try it as follows:
var div = document.getElementById('divId');
div.contentEditable = 'true';
var controlRange;
if (document.body.createControlRange) {
controlRange = document.body.createControlRange();
controlRange.addElement(div);
controlRange.execCommand('Copy');
}
div.contentEditable = 'false';

Then you should be able to paste the clipboard content into Word.

Thanks, this is exactly what I was looking for!

- Risto