javascript - Jquery - 删除多个图像预览的选项

时间:2016-06-19 14:16:37

标签: javascript jquery

这是我的第一篇文章,因为我真的卡在这里.. 我刚学会编码,我很难添加一个选项来删除已经预览过的图像..请帮我添加选项以删除预览中的每个图像(例如在每个图像的右上角添加一个“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');
    });
});

0 个答案:

没有答案