gpt4 book ai didi

javascript - blueimp 文件上传插件中的 maxFileSize 和 acceptFileTypes 不起作用。为什么?

转载 作者:IT王子 更新时间:2023-10-29 02:46:21 24 4
gpt4 key购买 nike

我正在使用 Blueimp jQuery 文件上传插件上传文件。

我在上传时没有问题,但选项 maxFileSizeacceptFileTypes 不起作用。

这是我的代码:

$(document).ready(function () {
'use strict';

$('#fileupload').fileupload({
dataType: 'json',
autoUpload: false,
acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
maxFileSize: 5000000,
done: function (e, data) {
$.each(data.result.files, function (index, file) {
$('<p style="color: green;">' + file.name + '<i class="elusive-ok" style="padding-left:10px;"/> - Type: ' + file.type + ' - Size: ' + file.size + ' byte</p>')
.appendTo('#div_files');
});
},
fail: function (e, data) {
$.each(data.messages, function (index, error) {
$('<p style="color: red;">Upload file error: ' + error + '<i class="elusive-remove" style="padding-left:10px;"/></p>')
.appendTo('#div_files');
});
},
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);

$('#progress .bar').css('width', progress + '%');
}
});
});

最佳答案

有同样的问题,blueimp 的家伙说“maxFileSize and acceptFileTypes are only supported by the UI version”并提供了一个(损坏的)链接来合并 _validate 和 _hasError 方法。

因此,在不知道如何在不弄乱脚本的情况下合并这些方法的情况下,我编写了这个小函数。它似乎对我有用。

只需添加这个

add: function(e, data) {
var uploadErrors = [];
var acceptFileTypes = /^image\/(gif|jpe?g|png)$/i;
if(data.originalFiles[0]['type'].length && !acceptFileTypes.test(data.originalFiles[0]['type'])) {
uploadErrors.push('Not an accepted file type');
}
if(data.originalFiles[0]['size'].length && data.originalFiles[0]['size'] > 5000000) {
uploadErrors.push('Filesize is too big');
}
if(uploadErrors.length > 0) {
alert(uploadErrors.join("\n"));
} else {
data.submit();
}
},

在 .fileupload 选项的开头,如您的代码所示

$(document).ready(function () {
'use strict';

$('#fileupload').fileupload({
add: function(e, data) {
var uploadErrors = [];
var acceptFileTypes = /^image\/(gif|jpe?g|png)$/i;
if(data.originalFiles[0]['type'].length && !acceptFileTypes.test(data.originalFiles[0]['type'])) {
uploadErrors.push('Not an accepted file type');
}
if(data.originalFiles[0]['size'].length && data.originalFiles[0]['size'] > 5000000) {
uploadErrors.push('Filesize is too big');
}
if(uploadErrors.length > 0) {
alert(uploadErrors.join("\n"));
} else {
data.submit();
}
},
dataType: 'json',
autoUpload: false,
// acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
// maxFileSize: 5000000,
done: function (e, data) {
$.each(data.result.files, function (index, file) {
$('<p style="color: green;">' + file.name + '<i class="elusive-ok" style="padding-left:10px;"/> - Type: ' + file.type + ' - Size: ' + file.size + ' byte</p>')
.appendTo('#div_files');
});
},
fail: function (e, data) {
$.each(data.messages, function (index, error) {
$('<p style="color: red;">Upload file error: ' + error + '<i class="elusive-remove" style="padding-left:10px;"/></p>')
.appendTo('#div_files');
});
},
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);

$('#progress .bar').css('width', progress + '%');
}
});
});

您会注意到我还在其中添加了一个文件大小函数,因为它也只适用于 UI 版本。

已更新以解决@lopsided 建议的过去问题:添加了 data.originalFiles[0]['type'].lengthdata.originalFiles[0]['size']。 length 以确保它们存在并且在测试错误之前首先不为空。如果它们不存在,则不会显示任何错误,它只会依赖于您的服务器端错误测试。

关于javascript - blueimp 文件上传插件中的 maxFileSize 和 acceptFileTypes 不起作用。为什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17451629/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com