Uważam, że Na7coldwater jest poprawne. Używany jest kod event.clipboardData. Zobacz następujący dowód pojęcia:
<html>
<body>
<div id="rte" contenteditable="true" style="height: 100%; width: 100%; outline: 0; overflow: auto"></div>
<script type="text/javascript">
document.getElementById("rte").focus();
document.body.addEventListener("paste", function(e) {
for (var i = 0; i < e.clipboardData.items.length; i++) {
if (e.clipboardData.items[i].kind == "file" && e.clipboardData.items[i].type == "image/png") {
// get the blob
var imageFile = e.clipboardData.items[i].getAsFile();
// read the blob as a data URL
var fileReader = new FileReader();
fileReader.onloadend = function(e) {
// create an image
var image = document.createElement("IMG");
image.src = this.result;
// insert the image
var range = window.getSelection().getRangeAt(0);
range.insertNode(image);
range.collapse(false);
// set the selection to after the image
var selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
};
// TODO: Error Handling!
// fileReader.onerror = ...
fileReader.readAsDataURL(imageFile);
// prevent the default paste action
e.preventDefault();
// only paste 1 image at a time
break;
}
}
});
</script>
</body>
Gmail przesyła obraz poprzez XMLHttpRequest zamiast osadzania go bezpośrednio jako adres URL danych. Wyszukiwanie w Google lub SO dla przeciągnięcia & zrzut plików należy ujawnić, w jaki sposób można to osiągnąć.
Proszę wziąć pod uwagę, że to tylko dowód koncepcji. Obsługa błędów i kod wykrywania przeglądarki/funkcji nie są uwzględniane.
Mam nadzieję, że to pomoże!
http://stackoverflow.com/questions/490908/paste-an-image-from-clipboard-using-java-script/4400761#4400761 Firefox (i prawdopodobnie Chrome) wkleja obrazy jako '' znaczniki z danymi URI jako href. Nie wiem, jak to robi Gmail. Prawdopodobnie z 'event.clipboardData'. –
Na7coldwater