JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
JavaScript
var body = document.body;
var cursor = document.createElement("div");
cursor.innerText = "Contenus des fichiers :\n";
cursor.ondragover = e => e.preventDefault();
cursor.ondrop = function(e) {
e.preventDefault();
if (e.dataTransfer.items) {
for (var i = 0; i < e.dataTransfer.items.length; i++) {
if (e.dataTransfer.items[i].kind === "file") {
var file = e.dataTransfer.items[i].getAsFile();
file.text().then(function(value) {
file.cursor = document.createElement("p");
body.appendChild(file.cursor);
file.cursor.innerText = file.name + " contient :";
file.cursor.innerText += " " + value;
});
}
}
}
else {
for(var i = 0; i < e.dataTransfer.files.length; i++) {
var file = e.dataTransfer.files[i];
file.text().then(function(value) {
file.cursor = document.createElement("p");
body.appendChild(file.cursor);
file.cursor.innerText = file.name + " contient :";
file.cursor.innerText += " " + value;
});
}
}
};
body.appendChild(cursor);