Blueimp Jquery文件上载图像重新调整大小选项与fileuploadadd函数绑定时不起作用

时间:2014-07-16 06:06:04

标签: jquery jquery-file-upload blueimp

我一直在使用Blueimp jQuery文件上传插件,一切似乎都运行良好。几天前我添加了一个fileuploadadd回调函数来将文件数据推送到全局数组。文件上传工作正常,但在客户端设置的重新调整大小选项不起作用,图像以原始大小上传。我需要将图像调整为800X600最大宽度和高度。

$('#eventForm').fileupload({
                disableImageResize: false,
                //filesContainer: $('div.files'),
                autoUpload: false,
                imageMaxWidth: 800,
                imageMaxHeight: 600,
                previewMaxWidth: 150,
                previewMaxHeight: 150,
                maxFileSize: 5000000,
                acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
                singleFileUploads: false,
                downloadTemplateId: 'event-download',
                uploadTemplateId: 'event-upload',
                uploadTemplate: function(o) { 
                    var rows = $();
                    $.each(o.files, function (index, file) {
                    var row = $('<tr class="template-upload bgWhite fade">' +
                       '<td class="floatl"><span class="preview"></span></td>' +
                       '<td class="dispNone"><p class="name"></p>' +
                       '<div class="error"></div>' +
                       '</td>' +
                       '<td class="dispNone"><p class="size"></p>' +
                       '<div class="progress"></div>' +
                       '</td>' +
                       '<td class="dispNone">' +
                       (!index && !o.options.autoUpload ?
                           '<button class="start" disabled>Start</button>' : '') +
                       (!index ? '<button class="cancel">Cancel</button>' : '') +
                       '</td>' +
                       '</tr>');
                    row.find('.name').text(file.name);
                    row.find('.size').text(o.formatFileSize(file.size));
                    if (file.error) {
                       row.find('.error').text(file.error);
                    }
                    rows = rows.add(row);
                    });
                    return rows;
                },
                // Uncomment the following to send cross-domain cookies:
                //xhrFields: {withCredentials: true},                
                url: jQuery('#site').val() + 'events/upload?4aToken=' + jQuery('#4aToken').val(),
                success: function(data){
                    //do success callback here;
                },
            }).bind('fileuploadsubmit', function(e, data) {
                jQuery('.fileupload-progress').removeClass('display-hide');
                //validate file share status
                    if ((jQuery('#shareCkts').val() == null || jQuery('#shareCkts').val() == '')) {
                        data.context.find('button').prop('disabled', false);
                        jQuery('#updateFrmValdtn_Nostalgia').parent().css('display', 'help-block').removeClass('display-hide');
                        jQuery('#updateFrmValdtn_Nostalgia').html('Please share this Nostalgia Moment to circuits').removeClass('dispNone');
                        return false;
                    }
                    var inputs = data.context.find(':input');
//                    if (inputs.filter('[value=""]').first().focus().length) {
//                        data.context.find('button').prop('disabled', false);
//                        return false;
//                    }
                        data.formData = jQuery('#eventForm').serializeArray();
            }).bind("fileuploadadd", function(e, data){
                filesList = [];
                filesList.push(data.files[0]);

            });

我使用以下命令在另一个ajax调用成功时将文件数据发送到服务器:

jQuery('#eventForm').fileupload('send', {files:filesList});

我搜索并发现在使用fileuloadadd或添加回调时,插件选项会被重置。无论如何,我可以使用此工作流程指定图像重新调整大小选项。

1 个答案:

答案 0 :(得分:1)

看起来你只需要打电话:

data.submit();

data内显示的.bind("fileuploadadd"...)对象。

对于其他阅读此内容的人来说,autoUpload: false,至关重要,因为没有submit()自动调用。{/ p>