Wie funktioniert das Einfügen von Bildern aus der Zwischenablage im Chrome 12-Update von Gmail?

Bilder aus der Zwischenablage in Gmail einfügen: So geht's in Chrome 12

Googles Ankündigung der Möglichkeit, Bilder direkt aus der Zwischenablage in einzufügen Gmail mit Chrome 12 hat Neugier auf den zugrunde liegenden Mechanismus geweckt. Obwohl sie die neueste Chrome-Version verwenden, konnten einige Benutzer keine Informationen darüber finden, wie diese Verbesserung in Webkit implementiert wurde.

Bei Experimenten scheint es, dass Chrome die neue Clipboard-API-Spezifikation übernommen hat. Diese Spezifikation ermöglicht die Definition eines „Paste“-Ereignishandlers, der auf die Eigenschaft event.clipboardData.items zugreifen kann. Durch den Aufruf von getAsFile() für jedes Element kann ein Blob-Objekt abgerufen werden. FileReader kann dann für diesen Blob verwendet werden, um seinen Inhalt zu bestimmen.

Unten ist ein Codeausschnitt, der zeigt, wie man eine Daten-URL für ein eingefügtes Bild erhält:

document.onpaste = function (event) {
    var items = (event.clipboardData || event.originalEvent.clipboardData).items;
    for (var index in items) {
        var item = items[index];
        if (item.kind === 'file') {
            var blob = item.getAsFile();
            var reader = new FileReader();
            reader.onload = function (event) {
                console.log(event.target.result); // data URL!
            }; 
            reader.readAsDataURL(blob);
        }
    }
};

Sobald eine Daten-URL vorliegt vorhanden ist, kann das Bild angezeigt werden. Alternativ kann es mit FormData oder readAsBinaryString hochgeladen werden.

Es ist wichtig zu beachten, dass JSON.stringify zwar möglicherweise nicht direkt auf die Elementliste funktioniert, MIME-Typen jedoch durch Iteration durch jedes Element mithilfe der DataTransferItem-Datenstruktur erhalten werden können .

Das obige ist der detaillierte Inhalt vonWie funktioniert das Einfügen von Bildern aus der Zwischenablage im Chrome 12-Update von Gmail?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!