1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
|
---
title: copy
slug: Web/API/Element/copy_event
translation_of: Web/API/Element/copy_event
original_slug: Web/Events/copy
---
<p>L'événement <strong>copy</strong> est déclenché lorsque l'utilisateur initie une copie par le biais de l'interface du navigateur (par exemple, Ctrl/Cmd+C ou "copier" du menu contextuel) et en réponse d'un appel de {{domxref("Document.execCommand", "document.execCommand('copy')")}} autorisé.</p>
<h2 id="Informations_générales">Informations générales</h2>
<dl>
<dt style="float: left; text-align: right; width: 120px;">Spécification</dt>
<dd style="margin: 0 0 0 120px;"><a class="external" href="https://www.w3.org/TR/clipboard-apis/#the-copy-action">Clipboard</a></dd>
<dt style="float: left; text-align: right; width: 120px;">Interface</dt>
<dd style="margin: 0 0 0 120px;">{{domxref("ClipboardEvent")}}</dd>
<dt style="float: left; text-align: right; width: 120px;">Propagation</dt>
<dd style="margin: 0 0 0 120px;">Oui</dd>
<dt style="float: left; text-align: right; width: 120px;">Annulable</dt>
<dd style="margin: 0 0 0 120px;">Oui</dd>
<dt style="float: left; text-align: right; width: 120px;">Cible</dt>
<dd style="margin: 0 0 0 120px;">{{domxref("Element")}}: L'élément ayant le focus (pour les éléments {{domxref("HTMLElement.contentEditable", "contentEditable")}} - l'élément contenant le début de la sélection), ou l'élément {{HTMLElement("body")}}</dd>
<dt style="float: left; text-align: right; width: 120px;">Action par défaut</dt>
<dd style="margin: 0 0 0 120px;">Voir ce-dessous</dd>
</dl>
<p>Un gestionnaire de cet événement peut modifier l'objet {{domxref("ClipboardEvent.clipboardData")}} en appellant {{domxref("DataTransfer.setData", "setData(format, data)")}}:</p>
<pre class="javascript">document.addEventListener('copy', function(e){
e.clipboardData.setData('text/plain', 'Hello, world!');
e.clipboardData.setData('text/html', '<b>Hello, world!</b>');
e.preventDefault(); // We want our data, not data from any selection, to be written to the clipboard
});</pre>
<p>Un gestionnaire de cet événement ne peut pas lire les données du presse-papiers en utilisant {{domxref("DataTransfer.getData", "clipboardData.getData()")}}.</p>
<p>L'action par défaut de l'événement dépend de la source de celui-ci et du comportement du gestionnaire:</p>
<ul>
<li>Un événement de copie <a href="/fr/docs/Web/Guide/Events/Creating_and_triggering_events">synthétique</a> n'a pas d'action par défaut;</li>
<li>Si l'événement n'a pas été annulé: Copie de la sélection (s'il y a) dans le presse-papiers;</li>
<li>Si le gestionnaire a annulé l'événement et appelé setData(): Copie le contenu de <em>clipboardData</em> de {{domxref("ClipboardEvent")}};</li>
<li>Si le gestionnaire a annulé l'événement sans appelé setData(): Aucune action.</li>
</ul>
<h2 id="Propriétés">Propriétés</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Property</th>
<th scope="col">Type</th>
<th scope="col">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><code>target</code> {{readonlyInline}}</td>
<td>{{domxref("EventTarget")}}</td>
<td>The event target (the topmost target in the DOM tree).</td>
</tr>
<tr>
<td><code>type</code> {{readonlyInline}}</td>
<td>{{domxref("DOMString")}}</td>
<td>The type of event.</td>
</tr>
<tr>
<td><code>bubbles</code> {{readonlyInline}}</td>
<td>{{jsxref("Boolean")}}</td>
<td>Whether the event normally bubbles or not.</td>
</tr>
<tr>
<td><code>cancelable</code> {{readonlyInline}}</td>
<td>{{jsxref("Boolean")}}</td>
<td>Whether the event is cancellable or not.</td>
</tr>
</tbody>
</table>
<h2 id="Specifications">Spécifications</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Spécification</th>
<th scope="col">Statut</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('Clipboard API', '#clipboard-event-copy')}}</td>
<td>{{Spec2('Clipboard API')}}</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility">Compatibilités navigateur</h2>
<p>{{Compat("api.Element.copy_event")}}</p>
<h2 id="See_also">Voir aussi</h2>
<ul>
<li>Événements relatifs : {{domxref("Element/cut_event", "cut")}}, {{domxref("Element/paste_event", "paste")}}</li>
<li>Cet événement sur {{domxref("Document")}} cible : {{domxref("Document/copy_event", "copy")}}</li>
<li>Cet événement sur {{domxref("Window")}} cible : {{domxref("Window/copy_event", "copy")}}</li>
</ul>
|