在 AIR 中 HTML 的複製和貼上

Adobe AIR 1.0 以及更新的版本

Adobe AIR 的 HTML 環境本身提供了另一組複製和貼上事件和預設行為。唯有執行於應用程式安全執行程序內的程式碼,才能透過 AIR Clipboard.generalClipboard 物件直接存取系統剪貼簿。位於非應用程式安全執行程序內的 JavaScript 程式碼如需存取剪貼簿,可在 HTML 文件中的元素傳送複製或貼上事件時,透過其傳送的 event 物件來進行。

複製和貼上事件包括: copy cut paste 。發生這些事件時所傳送的物件提供了 clipboardData 屬性,可以用來存取剪貼簿。

預設行為

根據預設,每當經由鍵盤快速鍵或快顯選單產生複製命令,AIR 便會複製選取的項目加以回應。而在可編輯的區域內,AIR 則會剪下文字以回應剪下命令,或將文字貼至游標位置或選取範圍以回應貼上命令。

若要避免此預設行為,事件處理常式可以呼叫所傳送之 event 物件的 preventDefault() 方法。

使用 event 物件的 clipboardData 屬性

由於發生複製或貼上事件而傳送的 event 物件,其 clipboardData 屬性可讓您用來讀取與寫入剪貼簿資料。

若要在處理複製或剪下事件時寫入剪貼簿,請使用 clipboardData 物件的 setData() 方法,並且傳入所要複製的資料和 MIME 類型:

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

若要存取貼上的資料,您可以使用 clipboardData 物件的 getData() 方法,並且傳入該資料格式的 MIME 類型。可用的格式會透過 types 屬性取得。

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

唯有透過 paste 事件所傳送的 event 物件,才能存取 getData() 方法和 types 屬性。

下列範例會說明如何覆寫 HTML 網頁預設的複製和貼上行為。 copy 事件處理常式會先將複製的文字設定為斜體,然後再複製到剪貼簿成為 HTML 文字。 cut 事件處理常式則先將選取的資料複製到剪貼簿,再將該份資料從文件中移除。 paste 處理常式會插入 HTML 格式的剪貼簿內容,並將插入的內容設定為粗體文字樣式。

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