Herausziehen von Daten aus einem HTML-Element

Adobe AIR 1.0 und höher

Festlegen der Ziehdaten

Gemäß dem Standardverhalten werden die meisten Inhalte auf einer HTML-Seite beim Ziehen kopiert. Mit den CSS-Eigenschaften -webkit-user-select und -webkit-user-drag können Sie steuern, welche Inhalte gezogen werden dürfen.

Überschreiben Sie das Herauszieh-Standardverhalten in der Prozedur für das Ereignis dragstart . Rufen Sie die Methode setData() der Eigenschaft dataTransfer des Ereignisobjekts auf, um Ihre eigenen Daten in die Ziehbewegung aufzunehmen.

Um anzuzeigen, welche Zieheffekte ein Quellobjekt unterstützt, wenn Sie sich auf das Standardverhalten verlassen, stellen Sie die Eigenschaft dataTransfer.effectAllowed des Ereignisobjekts ein, das für das Ereignis dragstart ausgelöst wurde. Sie können jede beliebige Kombination an Effekten verwenden. Wenn beispielsweise ein Quellelement sowohl die Kopier- als auch die Verknüpf effekte unterstützt, setzen Sie die Eigenschaft auf "copyLink" .

Festlegen der Ziehdaten

Fügen Sie mithilfe der Eigenschaft dataTransfer die Daten für die Ziehbewegung in die Prozedur für das Ereignis dragstart ein. Fügen Sie mithilfe der Methode dataTransfer.setData() Daten in die Zwischenablage ein und übergeben Sie dabei den MIME-Typ und die zu übertragenden Daten.

Angenommen, Sie haben in einer Anwendung ein Bildelement mit der ID imageOfGeorge , dann könnten Sie die folgende dragstart-Ereignisprozedur verwenden. In dem Beispiel werden Bilder von George in verschiedenen Datenformaten eingefügt, sodass andere Anwendungen die gezogenen Daten mit größerer Wahrscheinlichkeit nutzen können.

function dragStartHandler(event){         
    event.dataTransfer.effectAllowed = "copy"; 
     
    var dragImage = document.getElementById("imageOfGeorge"); 
    var dragFile = new air.File(dragImage.src); 
    event.dataTransfer.setData("text/plain","A picture of George"); 
    event.dataTransfer.setData("image/x-vnd.adobe.air.bitmap", dragImage); 
    event.dataTransfer.setData("application/x-vnd.adobe.air.file-list", 
                                new Array(dragFile)); 
}

Hinweis: Wenn Sie die Methode setData() der Eigenschaft dataTransfer aufrufen, werden vom Standard-Drag & Drop-Verhalten keine Daten hinzugefügt.