HTML kopiëren en plakken in AIR

Adobe AIR 1.0 of hoger

De HTML-omgeving in Adobe AIR biedt een eigen set gebeurtenissen en standaardgedrag voor kopiëren en plakken. Alleen code die in de toepassingssandbox wordt uitgevoerd, heeft rechtstreeks toegang tot het systeemklembord via het AIR-object Clipboard.generalClipboard. JavaScript-code in een niet-toepassingssandbox heeft toegang tot het klembord via het gebeurtenisobject dat is verzonden als reactie op een van de kopiëren-en-plakken-gebeurtenissen die zijn verzonden door een element in een HTML-document.

Kopiëren-en-plakken-gebeurtenissen zijn onder andere: copy, cut en paste. Het object dat voor deze gebeurtenissen is verzonden, biedt toegang tot het klembord via de eigenschap clipboardData.

Standaardgedrag

Als reactie op de kopieeropdracht worden de geselecteerde items standaard door AIR gekopieerd. Deze opdracht kan via een sneltoets of een snelmenu worden gegenereerd. In bewerkbare zones wordt tekst als reactie op de knipopdracht door AIR geknipt, of als reactie op de plakopdracht door AIR geplakt op de cursorpositie of de geselecteerde tekst.

Als u een ander gedrag wenst, kan uw gebeurtenishandler de methode preventDefault() van het verzonden gebeurtenisobject oproepen.

Eigenschap clipboardData van gebeurtenisobject gebruiken

Met de eigenschap clipboardData van het gebeurtenisobject dat als reactie op een van de kopieer- of plakgebeurtenissen is verzonden, kunt u klembordgegevens lezen en schrijven.

Als u naar het klembord wilt schrijven bij het werken met een kopieer- of knipgebeurtenis, gebruikt u de methode setData() van het object clipboardData, waarbij u de te kopiëren gegevens en het MIME-type opgeeft:

function customCopy(event){ 
    event.clipboardData.setData("text/plain", "A copied string."); 
}

Als u toegang wilt tot de gegevens die worden geplakt, gebruikt u de methode getData() van het object clipboardData, waarbij u het MIME-type van de gegevensindeling opgeeft. De beschikbare indelingen worden weergegeven door de eigenschap types. 

function customPaste(event){ 
    var pastedData = event.clipboardData("text/plain"); 
}

De methode getData() en de eigenschap types zijn alleen toegankelijk in het gebeurtenisobject dat is verzonden door de gebeurtenis paste.

Het volgende voorbeeld geeft aan hoe u het standaardgedrag bij kopiëren en plakken in een HTML-pagina kunt wijzigen. De gebeurtenishandler copy maakt de gekopieerde tekst cursief en kopieert deze als HTML-tekst naar het klembord. De gebeurtenishandler cut kopieert de geselecteerde gegevens naar het klembord en verwijdert deze uit het document. De gebeurtenishandler paste voegt de inhoud van het klembord als HTML in en maakt de ingevoegde tekst vet.

<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>