Fires on the source object before the selection is copied to the system clipboard.
| Inline |
<element onbeforecopy = "handler" ... > |
| Script |
object.onbeforecopy = handler |
| 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. |
| clientY |
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. |
| offsetY |
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