在 JQuery 文件上传演示中限制文件类型
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12303660/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Restricting file types in JQuery File upload demo
提问by Faisal Memon
I am using JQuery file upload demofor my next project with Codeigniter. Can anyone tell me how do I achieve the following :
我正在使用Codeigniter为我的下一个项目使用JQuery 文件上传演示。谁能告诉我如何实现以下目标:
- Restricting upload file types to .zip and .rar
- Restricting file size
- Clearing the list of Uploaded files (JQuery file upload plugin displays the list of already uploaded files)
- 将上传文件类型限制为 .zip 和 .rar
- 限制文件大小
- 清除已上传文件列表(JQuery文件上传插件显示已上传文件列表)
Help appreciated !!
帮助表示赞赏!
回答by Dav.id
you probably have a plethora of solutions now, however I wanted to use the BASIC plugin for the jquery uploader, i.e. without any other scripts.. for some reason the maxFileSize/fileTypes options were not working - however that is mostly no doubt to my lack of reading the documentation!
您现在可能有很多解决方案,但是我想为 jquery 上传器使用 BASIC 插件,即没有任何其他脚本..出于某种原因,maxFileSize/fileTypes 选项不起作用 - 然而,这无疑是我缺乏的阅读文档!
Anyway for me, it was as quick as doing the following:
无论如何,对我来说,它就像执行以下操作一样快:
add: function (e, data) {
var goUpload = true;
var uploadFile = data.files[0];
if (!(/\.(gif|jpg|jpeg|tiff|png)$/i).test(uploadFile.name)) {
common.notifyError('You must select an image file only');
goUpload = false;
}
if (uploadFile.size > 2000000) { // 2mb
common.notifyError('Please upload a smaller image, max size is 2 MB');
goUpload = false;
}
if (goUpload == true) {
data.submit();
}
},
So just using the ADD option to only allow the image types in the regex, and checking (in my case) the file size is a max of 2mb.
所以只使用 ADD 选项只允许正则表达式中的图像类型,并检查(在我的情况下)文件大小最大为 2mb。
Rather basic, and again I am sure the maxFileSize options work, just I am only including the basic plugin script jquery.fileupload.js
相当基本,我再次确定 maxFileSize 选项有效,只是我只包括基本的插件脚本 jquery.fileupload.js
EDITI should have added in my case I am uploading just one file (a profile image) so hence the data.files[0].. you could iterate through the files collection of course.
编辑我应该在我的情况下添加我只上传一个文件(个人资料图片),因此 data.files[0].. 你当然可以遍历文件集合。
回答by Potheek
In jquery.fileupload-ui.js edit this part:
在 jquery.fileupload-ui.js 中编辑此部分:
$.widget('blueimp.fileupload', $.blueimp.fileupload, {
options: {
// The maximum allowed file size:
maxFileSize: 100000000,
// The minimum allowed file size:
minFileSize: undefined,
// The regular expression for allowed file types, matches
// against either file type or file name:
acceptFileTypes: /(zip)|(rar)$/i,
----------------------------------------------------------------
To clear the list of uploaded files - Remove the $.getJSON call from main.js if you don't need that functionality.
清除已上传文件的列表 - 如果您不需要该功能,请从 main.js 中删除 $.getJSON 调用。
回答by blasteralfred Ψ
According to the official documentation;
根据官方文档;
$('#file_upload').fileUploadUIX({
maxFileSize: 5000000, // Maximum File Size in Bytes - 5 MB
minFileSize: 100000, // Minimum File Size in Bytes - 100 KB
acceptFileTypes: /(zip)|(rar)$/i // Allowed File Types
});
回答by shana
One other way to do is as follows.
另一种方法如下。
$('#upload').fileupload({
change: function (e, data) {
if (!(/\.(jpg|jpeg|png|pdf)$/i).test(data.files[0].name)) {
alert('Not Allowed');
return false;
}
}
});
回答by Satya
try looking at this line :
试试看这一行:
process: [
/*
{
action: 'load',
fileTypes: /^image\/(gif|jpeg|png)$/,
maxFileSize: 20000000 // 20MB
},
{
action: 'resize',
maxWidth: 1920,
maxHeight: 1200,
minWidth: 800,
minHeight: 600
},
in jquery.fileupload-fp.js
在 jquery.fileupload-fp.js 中