Загрузка файла Blueimp / Jquery: предварительный просмотр

С помощью загрузки файлов Blueimp / Jquery я могу просмотреть:

done: function (e, data) {
    var file = data.files[0];
    console.log(data.files[0]);
    console.log(data.result.files); // always undefined ...
    $(this).closest('tr').find('input[type=text]').val(file.name.substr(0, file.name.lastIndexOf('.')));
    $(this).remove();
},

Вернуть:

Blob {имя: "IMG_20160512_225352.jpg", предварительный просмотр: холст, размер: 221398, тип: "image/jpeg" }

Но, если я добавил "добавить" опции, у меня нет предварительного просмотра:

add: function (e, data) {
    var goUpload = true;
    var file = data.files[0];
    if (!(/\.(gif|jpg|jpeg|png)$/i).test(file.name)) {
        $(this).closest('tr').find('td:first').prepend('<div class="alert alert-danger text-justify"><ul class="list-unstyled"><li><span class="glyphicon glyphicon-exclamation-sign"></span> Seuls les types de fichiers suivants sont autorisés : .gif ; .jpg ; .jpeg ; .png</li></ul></div>');
        goUpload = false;
    }
    if (file.size > 2000000) {
        $(this).closest('tr').find('td:first').prepend('<div class="alert alert-danger text-justify"><ul class="list-unstyled"><li><span class="glyphicon glyphicon-exclamation-sign"></span> La taille maximale autorisée par fichier est de 2 Mo</li></ul></div>');
        goUpload = false;
    }
    if (goUpload === true) {
        data.submit();
    }
},
done: function (e, data) {
    var file = data.files[0];
    console.log(data.files[0]);
    console.log(data.result.files); // always undefined ...
    $(this).closest('tr').find('input[type=text]').val(file.name.substr(0, file.name.lastIndexOf('.')));
    $(this).remove();
},

Вернуть:

Файл { name: "IMG_20160512_225352.jpg", lastModified: 1463086668000, lastModifiedDate: Дата 2016-05-12T20:57:48.000Z, размер: 1034928, тип: "image/jpeg" }

Вы можете мне помочь? Я хочу, чтобы предварительный просмотр для печати его.

Полный код JS:

$('.file_upload:last').fileupload({
    dataType: 'json',
    url: '/app_dev.php/_uploader/gallery/upload',
    disableImageResize: /Android(?!.*Chrome)|Opera/
        .test(window.navigator && navigator.userAgent),
    imageMaxWidth: 1200,
    imageMaxHeight: 1200,
    previewMaxWidth : 350,
    previewMaxHeight : 350,
    imageCrop: false,
    autoUpload: true,
    /*
    add: function (e, data) {
        var goUpload = true;
        var file = data.files[0];
        if (!(/\.(gif|jpg|jpeg|png)$/i).test(file.name)) {
            $(this).closest('tr').find('td:first').prepend('<div class="alert alert-danger text-justify"><ul class="list-unstyled"><li><span class="glyphicon glyphicon-exclamation-sign"></span> Seuls les types de fichiers suivants sont autorisés : .gif ; .jpg ; .jpeg ; .png</li></ul></div>');
            goUpload = false;
        }
        if (file.size > 2000000) {
            $(this).closest('tr').find('td:first').prepend('<div class="alert alert-danger text-justify"><ul class="list-unstyled"><li><span class="glyphicon glyphicon-exclamation-sign"></span> La taille maximale autorisée par fichier est de 2 Mo</li></ul></div>');
            goUpload = false;
        }
        if (goUpload === true) {
            data.submit();
        }
    },
    */
    done: function (e, data) {
        var file = data.files[0];
        console.log(data);
        console.log(data.files[0]);
        console.log(data.result.files);
        $(this).closest('tr').find('input[type=text]').val(file.name.substr(0, file.name.lastIndexOf('.')));
        $(this).remove();
    },
    progressall: function (e, data) {
        var input_this = this;
        var progress = parseInt(data.loaded / data.total * 100, 10);
        $(input_this).closest('tr').find('.upload-progress .progress-bar-current').text(progress + '%');
        $(input_this).closest('tr').find('.upload-progress .progress-bar-current').css(
            'width',
            progress + '%'
        );
    },
    fail: function(e, data) {
        var input_this = this;
        $(input_this).closest('tr').html('<td colspan="3" class="text-center background-orange"><i class="fa fa-exclamation-circle"></i> Erreur lors du transfert du fichier, veuillez vérifier qu\'il soit conforme (notamment types de fichiers autorisés, taille maximale)</td>');
    }
    });
});

0 ответов

Другие вопросы по тегам