將資料拖曳到 HTML 元素中

Adobe AIR 1.0 以及更新的版本

預設的行為只允許將文字拖曳到頁面的可編輯區域。您可藉由在元素的開頭標籤中加入 contenteditable 特質,以指定讓該元素及其子元素成為可編輯的項目。您也可以將文件物件的 designMode 屬性設定為 "on" ,使整份文件成為可編輯。

針對任何能夠接受拖曳的資料之頁面元素,您可以處理其 dragenter dragover drop 事件,如此便能支援替代的拖入行為。

啟用拖入

若要處理拖入手勢,您必須先取消預設的行為。對於任何您想要用來當做放下目標的 HTML 元素,偵聽其 dragenter dragover 事件。在這些事件的處理常式中,呼叫所傳送之事件物件的 preventDefault() 方法。取消預設的行為後,不可編輯的區域就能接受放下動作。

取得放下的資料

您可以在 ondrop 事件的處理常式中存取放下的資料:

function doDrop(event){ 
    droppedText = event.dataTransfer.getData("text/plain"); 
}

使用 dataTransfer.getData() 方法並且傳入所要讀取資料格式的 MIME 類型,將資料讀入剪貼簿。您可以使用 dataTransfer 物件的 types 屬性,找出可用的資料格式為何。 types 陣列中包含每一種可用格式的 MIME 類型字串。

一旦您在 dragenter 或 dragover 事件中取消了預設的行為,就必須自行將任何放下的資料插入文件中適當的位置。目前並無任何 API 可將元素內的滑鼠位置轉換成插入點。這項限制導致插入類型的拖曳手勢變得較難實作。