SVGGraphicsElement: copy-Ereignis
Das copy
-Ereignis wird bei SVGGraphicsElements
ausgelöst, wenn der Benutzer über die Benutzeroberfläche des Browsers eine Kopieraktion startet.
Die Standardaktion des Ereignisses besteht darin, die Auswahl (falls vorhanden) in die Zwischenablage zu kopieren.
Ein Handler für dieses Ereignis kann den Inhalt der Zwischenablage ändern, indem er setData(format, data)
auf der ClipboardEvent.clipboardData
-Eigenschaft des Ereignisses aufruft und die Standardaktion des Ereignisses mit event.preventDefault()
verhindert.
Der Handler kann jedoch die Daten in der Zwischenablage nicht lesen.
Es ist möglich, ein synthetisches copy
-Ereignis zu erstellen und auszulösen, dies hat jedoch keine Auswirkungen auf die System-Zwischenablage.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener()
oder setzen Sie eine Ereignis-Handler-Eigenschaft.
addEventListener("copy", (event) => { })
oncopy = (event) => { }
Ereignistyp
Ein ClipboardEvent
. Erbt von Event
.
Beispiel
HTML
<?xml version="1.0" encoding="UTF-8"?>
<svg
viewBox="0 0 100 30"
width="600"
height="320"
xmlns="http://www.w3.org/2000/svg">
<text x="5" y="10" id="text-to-copy">Copy this text</text>
<foreignObject x="5" y="20" width="90" height="20">
<input xmlns="http://www.w3.org/1999/xhtml" placeholder="Paste it here" />
</foreignObject>
</svg>
CSS
input {
font-size: 10px;
width: 100%;
height: 90%;
box-sizing: border-box;
border: 1px solid black;
}
JavaScript
document.querySelector("text").addEventListener("copy", (evt) => {
evt.clipboardData.setData(
"text/plain",
document.getSelection().toString().toUpperCase(),
);
evt.preventDefault();
});
Ergebnis
Spezifikationen
No specification found
No specification data found for undefined
.
Check for problems with this page or contribute a missing spec_url
to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.