这是我的第一篇文章,因为我真的卡在这里.. 我刚学会编码,我很难添加一个选项来删除已经预览过的图像..请帮我添加选项以删除预览中的每个图像(例如在每个图像的右上角添加一个“X”符号)。
感谢您的帮助..
以下是我的HTML代码:
<div class="form-group">
<label>Upload Foto </label>
<span class="btn btn-default btn-file">
<i class="fa fa-cloud-upload fa-large"></i> Upload Photos
<%= file_field_tag "images[]", id: "gallery-photo-add", type: :file, multiple: true %>
</span>
</div> <div class="gallery"></div>
这是javascript代码:
$(function() {
// Multiple images preview in browser
var imagesPreview = function(input, placeToInsertImagePreview) {
if (input.files) {
var filesAmount = input.files.length;
for (i = 0; i < filesAmount; i++) {
var reader = new FileReader();
reader.onload = function(event) {
$($.parseHTML('<img>')).attr('src', event.target.result).appendTo(placeToInsertImagePreview);
}
reader.readAsDataURL(input.files[i]);
}
}
};
$('#gallery-photo-add').on('change', function() {
imagesPreview(this, 'div.gallery');
});
});