【问题标题】:Restricting file types in JQuery File upload demo在 JQuery 文件上传演示中限制文件类型
【发布时间】:2012-08-31 11:37:54
【问题描述】:

我正在使用 JQuery file upload demo 进行下一个 Codeigniter 项目。谁能告诉我如何实现以下目标:

  • 将上传文件类型限制为 .zip 和 .rar
  • 限制文件大小
  • 清除已上传文件列表(JQuery文件上传插件显示已上传文件列表)

帮助赞赏!!

【问题讨论】:

  • 确保您也在服务器端执行所有这些限制/验证。

标签: jquery codeigniter file-upload blueimp


【解决方案1】:

你现在可能有很多解决方案,但是我想为 jquery 上传器使用 BASIC 插件,即没有任何其他脚本.. 由于某种原因 maxFileSize/fileTypes 选项不起作用 - 但这是毫无疑问的由于我缺乏阅读文档!

无论如何,对我来说,它就像执行以下操作一样快:

    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();
        }
    },

因此,只需使用 ADD 选项仅允许正则表达式中的图像类型,并检查(在我的情况下)文件大小最大为 2mb。

相当基本,我再次确定 maxFileSize 选项有效,只是我只包括基本插件脚本 jquery.fileupload.js

编辑 我应该在我的情况下添加我只上传一个文件(个人资料图片),因此 data.files[0].. 你当然可以遍历文件集合。

【讨论】:

  • 终于!我一直在寻找一个有效的例子。谢谢 :)
  • add 按文件运行。因此data.submit 仅指一个文件。
  • 如果我没有得到这个我不会更开心..:)
  • 非常有帮助.. thz
  • 太好了,我刚刚在 common.notifyError('You must select an image file only') 之前添加了 alert("You must select an image file only") 来通知用户
【解决方案2】:

在 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,
        ----------------------------------------------------------------

要清除已上传文件的列表 - 如果您不需要该功能,请从 main.js 中删除 $.getJSON 调用。

【讨论】:

    【解决方案3】:

    根据官方文档;

    $('#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
    });
    

    【讨论】:

      【解决方案4】:

      另一种方法如下。

       $('#upload').fileupload({ 
             change: function (e, data) { 
                      if (!(/\.(jpg|jpeg|png|pdf)$/i).test(data.files[0].name)) {
                          alert('Not Allowed');
                          return false;
                      }
              } 
       });
      

      【讨论】:

        【解决方案5】:

        试着看看这一行:

         process: [
                    /*
                        {
                            action: 'load',
                            fileTypes: /^image\/(gif|jpeg|png)$/,
                            maxFileSize: 20000000 // 20MB
                        },
                        {
                            action: 'resize',
                            maxWidth: 1920,
                            maxHeight: 1200,
                            minWidth: 800,
                            minHeight: 600
                        },
        

        在 jquery.fileupload-fp.js 中

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 2010-12-16
          • 1970-01-01
          • 2014-03-21
          • 1970-01-01
          • 2010-10-13
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多