简单的跨浏览器,带有进度条的jQuery/PHP文件上传

Tom*_*Tom 37 php jquery internet-explorer file-upload progress-bar

我知道有关于此的几个主题,但没有一个为文件上传器脚本提供了明确的解决方案:

  1. 适用于IE7 +
  2. 有一个进度条(在每个浏览器上)
  3. 没有Flash(或后备)

有解决方案吗

bla*_*d Ψ 39

您可以使用AlbanX的Axuploader.它有;

  • 在所有浏览器上上传多文件
  • html5浏览器上的多文件选择(不是IE)
  • 上传html5浏览器的进度信息
  • html5浏览器的文件大小信息
  • 没有flash,没有Silverlight,在其他插件上,只有JavaScript
  • 支持IE 6 +,Firefox 2 +,Safari 2 +,Chrome 1+
  • 按块上传文件,以获得更高的性能
  • 不依赖于服务器最大帖子大小和最大上传文件大小限制

您也可以尝试使用Widen的Fine-Uploader.它有;

  • FF,Chrome和Safari中的多个文件选择,进度条
  • 在FF,Chrome和Safari(OS X)中拖放文件选择
  • 上传可以取消
  • 如果使用FineUploader或FineUploaderBasic,则根本没有外部依赖关系.如果使用可选的jQuery包装器,则当然需要jQuery.
  • FineUploaderBasic只需要相关的Fine Uploader javascript文件.可以省略所有Fine Uploader css和图像文件.
  • 不使用Flash
  • 完全使用HTTPS
  • 在IE7 +,Firefox,Safari(OS X),Chrome,IOS6以及各种版本的Android中进行了测试.现在也支持IE10!
  • 能够在选择文件后立即上传文件,或者将其"排队"以便稍后根据用户的请求进行上传
  • 上传失败时显示服务器的特定错误消息(将鼠标悬停在失败的上传项目上)
  • 能够自动重试失败的上传
  • 允许用户手动重试失败上传的选项
  • 创建自己的文件验证器和/或使用一些默认验证器包含Fine Uploader
  • 在上传过程的各个阶段接收回调
  • 发送服务器端的任何参数以及每个文件.
  • 通过拖放(Chrome 21+)上传目录.
  • 在查询字符串或请求正文中包含参数.
  • 提交要通过API上传的文件.
  • 将文件拆分为多个请求(文件分块/分区).
  • 从先前的会话恢复失败/停止上传
  • 删除上传的文件
  • CORS支持
  • 通过API上传任何Blob对象.
  • 轻松设置并强制执行最大项目限制.
  • 通过粘贴(Chrome)上传图片.
  • 独立文件和文件夹拖放模块.默认情况下集成到FineUploader模式.
  • 在影响关联文件的回调中执行异步(非阻塞)任务
  • 直接从移动设备的相机上传图像
  • 检索上载文件的统计信息并接收有关状态更改的回调
  • 还有很多!

或者jQuery-File-Upload插件(与IE兼容),它有;

  • 多文件上传:允许一次选择多个文件并同时上传.
  • 拖放支持:允许通过从桌面或文件管理器拖放文件并将其放在浏览器窗口上来上载文件.
  • 上传进度条:显示进度条,指示单个文件和所有上传组合的上传进度.
  • 可取消上传:可以取消单个文件上传以停止上传进度.
  • 可恢复上传:支持Blob API的浏览器可以恢复中止上传.
  • 分块上传:大型文件可以使用支持Blob API的浏览器以较小的块上传.
  • 客户端图像大小调整:使用支持所需JS API的浏览器,可以在客户端自动调整图像大小.
  • 预览图像:在使用支持所需JS API的浏览器上载之前,可以显示图像文件的预览.
  • 不需要浏览器插件(例如Adobe Flash):该实现基于HTML5和JavaScript等开放标准,不需要额外的浏览器插件.
  • 旧版浏览器的优雅后备:如果支持,则通过XMLHttpRequests上传文件,并使用iframe作为旧版浏览器的后备.
  • HTML文件上传表单后备:如果禁用JavaScript,则显示标准HTML文件上载表单.
  • 跨站点文件上载:支持使用跨站点XMLHttpRequests将文件上载到其他域.
  • 多个插件实例:允许在同一网页上使用多个插件实例.
  • 可自定义和可扩展:提供API以设置各个选项并为各种上载事件定义callBack方法.
  • 多部分和文件内容流上传:文件可以作为标准"multipart/form-data"或文件内容流(HTTP PUT文件上载)上载.
  • 与任何服务器端应用程序平台兼容:适用于支持标准HTML表单文件上载的任何服务器端平台(PHP,Python,Ruby on Rails,Java,Node.js,Go等).

参考

使用jQuery示例查看10个HTML5文件上传,以查看一些适用于HTML5的优秀文件上传器

此外,这里有10+ PHP Ajax上传文件教程 - 免费下载,您可以从很多上传者中选择.