Supprimer les images uploadées
Bonjour
J'ai un input file "multiple" qui me permet d'uploader plusieurs fichiers, mais comment les supprimer en local en cliquant par exemple sur un bouton "remove" avant d'effectuer un upload ?
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
| function handleFileSelect(evt) {
var files = evt.target.files; // FileList object
// Loop through the FileList and render image files as thumbnails.
for (var i = 0, f; f = files[i]; i++) {
// Only process image files.
if (!f.type.match('image.*')) {
continue;
}
var reader = new FileReader();
// Closure to capture the file information.
reader.onload = (function(theFile) {
return function(e) {
// Render thumbnail.
var span = document.createElement('span');
span.innerHTML = ['<div style="display:inline-block; width:200px; height:220px; line-height: 220px; vertical-align:top; border:1px solid #CCCCCC; text-align:center; margin: 10px 10px 10px 10px; padding: 5px 5px 5px 5px; box-shadow: 5px 5px 8px #aaa;"><p><img class="thumb" src="', e.target.result, '" title="',
escape(theFile.name), '" width="150px"/></p><p><a href="#" title="Supprimer" id="deleteFiles"><input type="hidden" value="fileName" name="fileName" class="fileName"><span class="heydings_icons_3" style="float:right;">X</span></a></p></div>'].join('');
document.getElementById('list').insertBefore(span, null);
};
})(f);
// Read in the image file as a data URL.
reader.readAsDataURL(f);
}
}
document.getElementById('files').addEventListener('change', handleFileSelect, false);
$("#files").change(function(){
var fileName = $("#fileName").val();
alert(fileName);
}); |
Merci
