Egenskapen
clipboardData
för händelseobjektet som skickas som ett resultat av någon av copy- eller paste-händelserna gör det möjligt att läsa och skriva Urklipps-data.
Om du vill skriva till Urklipp vid en copy- eller cut-händelse ska du använda metoden
setData()
för objektet
clipboardData
, så skickar du de data som ska kopieras samt MIME-typen:
function customCopy(event){
event.clipboardData.setData("text/plain", "A copied string.");
}
Om du vill ha åtkomst till de data som klistras in kan du använda metoden
getData()
för objektet
clipboardData
, som skickas i MIME-typen för dataformatet. Vilka format som finns rapporteras i egenskapen
types
.
function customPaste(event){
var pastedData = event.clipboardData("text/plain");
}
Metoden
getData()
och egenskapen
types
är bara tillgängliga i händelseobjektet som skickas av händelsen
paste
.
I exemplet nedan visas hur du åsidosätter standardbeteendet för kopiera och klistra in på en HTML-sida. Hanteraren för händelsen
copy
gör den kopierade texten kursiv och kopierar den till Urklipp som HTML-text. Hanteraren för händelsen
cut
kopierar markerade data till Urklipp och tar bort dem från dokumentet. Hanteraren för händelsen
paste
infogar innehållet i Urklipp som HTML och formaterar infogningen med fetstil.
<html>
<head>
<title>Copy and Paste</title>
<script language="javascript" type="text/javascript">
function onCopy(event){
var selection = window.getSelection();
event.clipboardData.setData("text/html","<i>" + selection + "</i>");
event.preventDefault();
}
function onCut(event){
var selection = window.getSelection();
event.clipboardData.setData("text/html","<i>" + selection + "</i>");
var range = selection.getRangeAt(0);
range.extractContents();
event.preventDefault();
}
function onPaste(event){
var insertion = document.createElement("b");
insertion.innerHTML = event.clipboardData.getData("text/html");
var selection = window.getSelection();
var range = selection.getRangeAt(0);
range.insertNode(insertion);
event.preventDefault();
}
</script>
</head>
<body onCopy="onCopy(event)"
onPaste="onPaste(event)"
onCut="onCut(event)">
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore
veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam
voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur
magni dolores eos qui ratione voluptatem sequi nesciunt.</p>
</body>
</html>