У меня есть несколько загрузок изображений на странице для предварительного просмотра и удаления. Однако будет удален только тег предварительного изображения, а не выбранный файл. Мой код:
<div class="field" align="left">
<input type="file" id="images_{$name}" name="images[{$name}][]" multiple />
</div>
<script>
$(document).ready(function() {
if (window.File && window.FileList && window.FileReader) {
$("#images_{$name}").on("change", function(e) {
var storedFiles = "images_{$name}";
var files = e.target.files,
filesLength = files.length;
for (var i = 0; i < filesLength; i++) {
var f = files[i]
var fileReader = new FileReader();
fileReader.onload = (function(e) {
var file = e.target;
$("<span class=\"pip\">" +
"<img class=\"imageThumb\" src=\"" + e.target.result + "\" title=\"" + file.name + "\"/>" +
"<br/><span class=\"remove\">{__('remove_image')}</span>" +
"</span>").insertAfter("#images_{$name}");
$(".remove").click(function() {
$(this).parent(".pip").remove();
});
});
fileReader.readAsDataURL(f);
}
});
} else {
alert("Your browser doesn't support to File API")
}
});
</script>
Я выбрал 4 изображения и удалил 2 из них. После отправки формы в массиве $_FILE
было 4 элемента. Однако я удалил 2 изображения.
Печать массива $ _FILE:
![Print $_FILE array](https://i.stack.imgur.com/SrT1U.png)