DHTML Events
Fires on the source object before the selection is copied to the system clipboard.
Inline HTML |
<element onbeforecopy = "handler" ... > |
All platforms |
Event property |
object.onbeforecopy = handler |
ECMA-262 Language Specification |
Named script |
<script FOR=object EVENT = onbeforecopy> |
Internet Explorer® only |
Bubbles |
Yes |
Cancels |
Yes |
To invoke |
After selecting the text:
- Right-click to display the context menu and select Copy.
- Or press CTRL + C.
|
Default action |
None. |
The onbeforecopy event fires on the source element. Use the setData method to specify a data format for the selection.
While event handlers in the Document Object Model do not receive parameters directly, the handler can query the event object for data.
Event Object Properties
altKey |
Retrieves the current state of the ALT key. |
cancelBubble |
Sets or retrieves whether the current event should bubble up the hierarchy of event handlers. |
clientX |
Retrieves the x-coordinate of the position of the cursor when the mouse is clicked, relative to the size of the client area of the window but excluding window decorations or scroll bars. |
clientX |
Returns the y-coordinate of the position of the cursor when the mouse is clicked, relative to the size of the client area of the window but excluding window decorations or scroll bars. |
ctrlKey |
Retrieves the state of the CTRL key. |
dataTransfer |
Provides access to predefined clipboard formats for use in data transfer operations. |
offsetX |
Retrieves the horizontal coordinate of the mouse's position relative to the object firing the event. |
offsetX |
Retrieves the vertical coordinate of the mouse's position relative to the object firing the event. |
returnValue |
Sets or retrieves the return value from the event. |
screenX |
Retrieves the horizontal position of the mouse, in pixels, relative to the user's screen. |
screenY |
Retrieves the vertical position of the mouse, in pixels, relative to the user's screen. |
shiftKey |
Retrieves the state of the SHIFT key. |
srcElement |
Retrieves the object that fired the event. |
type |
Retrieves the event name from the event object. |
x |
Returns the horizontal position of the mouse when the event fires. |
y |
Returns the vertical position of the mouse when the event fires. |
The example demonstrates how to use the onbeforecopy event to customize copy behavior.
Sample Code
<head>
<script language="JavaScript">
var sNewValue = "copy event fired";
var bFired = false;
var sSave = "";
function Source_Beforecopy() {
sSave = oSource.innerText;
bFired = true;
event.returnValue = false;
}
function Source_Copy() {
window.dataTransfer.setData("Text", sNewValue);
}
function Target_BeforePaste() {
event.returnValue = false;
}
function Target_Paste() {
event.returnValue = false;
oTarget.value = window.dataTransfer.getData("Text");
}
</script>
</head>
<body>
<span id=oSource onbeforecopy="Source_Beforecopy()"
oncopy="Source_Copy()">copy this text</span>
<INPUT id=oTarget onbeforepaste="Target_BeforePaste()"
onpaste="Target_Paste()">
</body>
Show me
Data Transfer Overview, onbeforecut, onbeforepaste, oncopy, oncut, onpaste, setData