Clipboard - Cut Copy Paste With JavaScript

Mahsha · Jun 1, 2009

<html>
<head>
<title>Clipboard cut, copy and paste with JavaScript</title>
<script type="text/javascript">
function CutToClipboard()
{
CutTxt = document.selection.createRange();
CutTxt.execCommand("Cut");
}

function CopyToClipboard()
{
CopiedTxt = document.selection.createRange();
CopiedTxt.execCommand("Copy");
}

function PasteFromClipboard()
{
document.Form1.txtArea.focus();
PastedText = document.Form1.txtArea.createTextRange();
PastedText.execCommand("Paste");
}
</script>
</head>
<body>
<form name="Form1">
<h1>Clipboard cut, copy and paste with JavaScript</h1>
Select this text, copy it using the copy button, and paste it
below.<br /><br />
<textarea id="txtArea" cols="60" rows="5"></textarea>
<br />
<input type="button" onClick="CutToClipboard()" value="Cut to
clipboard" />
<input type="button" onClick="CopyToClipboard()" value="Copy to
clipboard" />
<input type="button" onClick="PasteFromClipboard()" value="Paste
from clipboard" />
</form>
</body>
</html>

Thomas 'PointedEars' Lahn · Jun 1, 2009

Mahsha said:
<html>

The DOCTYPE declaration is missing again.

<head>
<title>Clipboard cut, copy and paste with JavaScript</title>
<script type="text/javascript">

At last.

function CutToClipboard()

It's not a constructor, so it should not start uppercase.

{
CutTxt = document.selection.createRange();

Undeclared (and unwise) identifier, missing feature test.

CutTxt.execCommand("Cut");
}

function CopyToClipboard()
{
CopiedTxt = document.selection.createRange();
CopiedTxt.execCommand("Copy");
}

function PasteFromClipboard()

See above.

{
document.Form1.txtArea.focus();
document.forms["Form1"].elements["txtArea"].focus()

PastedText = document.Form1.txtArea.createTextRange();
PastedText.execCommand("Paste");
}

but in this case

function pasteFromClipboard(f, controlName)
{
/* Add feature tests here! */
var pastedText = f.elements[controlName].createTextRange();
pastedText.execCommand("Paste");
}

<input type="button" value="Paste from clipboard"
onclick="pasteFromClipboard(this.form)">

Although it is the first time I see execCommand() called as method of
a form control -- always thought it was document.execCommand() only,
and you had to focus the control first.

</script>
</head>
<body>
<form name="Form1">

The #REQUIRED `action' attribute is missing.

<h1>Clipboard cut, copy and paste with JavaScript</h1>
Better.

Select this text, copy it using the copy button, and paste it
below.<br /><br />

<p>Select this ...<p>

instead.

<textarea id="txtArea" cols="60" rows="5"></textarea>

The textarea needs a _name_ if this should work everywhere.

<br />

Probably a block element, say `div', enclosing the rest would be better.

<input type="button" onClick="CutToClipboard()" value="Cut to
clipboard" />
<input type="button" onClick="CopyToClipboard()" value="Copy to
clipboard" />
<input type="button" onClick="PasteFromClipboard()" value="Paste
from clipboard" />

At last. Now you only have to generate them dynamically (as they don't work
without scripting), and either get rid of the `/' or write proper XHTML
(including `onclick' instead of `onClick'). One probably wants to try the
`button' element here, and icon images on/in it.

PointedEars

Gregor Kofler · Jun 4, 2009

Mahsha meinte:

[snip]

Ah, another round in Masha's quiz show "Guess the question".

Are you showing off your JS "abilities" or do you need help? In the
latter case, it would be nice to elaborate on what you want.

Gregor

Check forms With JavaScript	1	Mar 28, 2023
Song requests	4	Aug 16, 2023
In javascript, XML File Create, File Save	2	Jul 17, 2023
Clipboard - Copy Text To Clipboard	3	Jun 1, 2009
I dont get this. Please help me!!	2	Jan 24, 2023
Filename undefined for Blob ?	1	Oct 28, 2023
Issue with textbox script?	0	Sep 5, 2022
Javascript DOM	1	Mar 29, 2023

Clipboard - Cut Copy Paste With JavaScript

Mahsha

Thomas 'PointedEars' Lahn

Gregor Kofler

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads