0
In meinem Code, ich erzeuge eine Miniaturansicht des Bildes Drag-dropped oder kopieren-einfügen. Ziehen und Ablegen ist kein Problem, aber mit Kopieren und Einfügen kann ich einen Fehler in Safari sehen (Schnappschuss unten) aber immer noch wird das Vorschaubild erzeugt!Image einfügen in zufrieden stellende Div arbeiten aus einem falschen Grund in Safari
Fehler: 
Relevante Schnipsel meines Codes:
document.getElementById('target').addEventListener('paste', function(event){
console.log("pasted!", event);
this.style.background='green';
// get pasted data; Source: http://codingmiles.com/pasting-image-contenteditable-div/
var pastedData = event.clipboardData.items[0];
console.log("pastedData",pastedData);
// If the clipboard data is of type image, read the data
if(pastedData.type.indexOf("image") === 0) {
console.log('calling thumbnail function'); // does not show up in the console! o.O
composeThumbnail(pastedData.getAsFile()); // this still works!
}
});
function composeThumbnail(file) { // source: https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications
if (!/^image\//.test(file.type)) { // if not an image; 0 since we take only 1 image, if multiple dragged at once, consider only the first one in the array
console.log('ERROR: Not an image file.');
return false;
}
// compose an <img> for the thumbnail
var thumbnailImage = document.createElement("img");
thumbnailImage.file = file;
document.getElementById('target').appendChild(thumbnailImage);
var reader = new FileReader();
reader.onload = (function(thumbnailImage) {
// this image is part of the data, so send typing notification to the agent
return function(event) {
thumbnailImage.src = event.target.result;
};
})(thumbnailImage);
reader.readAsDataURL(file);
}#target{
width: 100%;
height: 200px;
border: 2px solid black;
border-radius: 5px;
background: transparent;
padding: 15px;
}
#target img{
height: 25%;
width: auto;
vertical-align: middle;
border-radius: 5px;
padding: 5px;
}
#target *{
vertical-align: text-top;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<div id="target" contenteditable="true"></div>
</body>
</html>Wie in den Kommentaren erwähnt, ich this resource für die Paste Ereignis verwendet haben Handler.
Meine Safari-Version ist 9.1 und ich bin auf Mac OS X El Capitan.
Warum wird das Thumbnail noch generiert? Was fehlt mir hier?