使用jQuery fileupload上传ASP.NET文件

时间:2019-11-15 06:05:57

标签: javascript asp.net asp.net-mvc

我已参考此link来解决覆盖先前选择的问题。但是,这导致了另一个问题。文件已复制并保存了两次。例如如果选择了3个文件,则6个文件将保存到数据库中。

            <input type="file" id="files" name="files" class="btn" style="color:white" multiple />
            <div id="preview" class="thumbnail"></div>

以下是我的JavaScript代码。

function previewImages() {
    linebreak = document.createElement("br");
    var preview = document.querySelector('#preview');
    if (this.files) {
        [].forEach.call(this.files, readAndPreview);
    }
    function readAndPreview(file) {
        // Make sure `file.name` matches our extensions criteria
        if (!/\.(jpe?g|png|gif)$/i.test(file.name)) {
            $('#files').val('');
            return alert(file.name + " is not an image");

        } else if (file.size > 4194304) {
            $('#files').val('');

            return alert(file.name + "is larger than 4MB");

        } else {
            var reader = new FileReader();
            reader.addEventListener("load", function () {
                var image = new Image();
                image.height = 100;
                image.title = file.name;
                image.src = this.result;
                preview.append(image.title);
                preview.appendChild(image);
            });
            reader.readAsDataURL(file);
        }
    }
}
//document.querySelector('#files').addEventListener("change", previewImages);
$(document).on('change', 'input[type="file"][multiple]', function () {
    var $this = $(this);
    $this.clone().insertAfter($this);
    $this.hide();

});

$(document).on('change', 'input[type="file"][multiple]', previewImages);

0 个答案:

没有答案
相关问题