首页 > 编程知识 正文

jquery好用的上传插件(web文件上传日志)

时间:2023-05-03 10:53:33 阅读:99395 作者:2745

介绍

fileponds是一个JavaScript库,提供了流畅的拖放文件上传功能。你可以上传你扔在上面的任何东西,优化图像以加快上传速度,并提供非常优雅、可靠和流畅的用户体验。

00-1010基于MIT开源协议

https://github.com/pqina/filepond

Github

核心库是用普通JavaScript编写的,所以可以在任何地方使用。它可以在不同的框架中使用,提供React、Vue、Svelte、Angular和jQuery。您可以选择与项目框架相同的适配器库。

适配框架

输入类型=“文件”

class='filepond '

名称=“文件池”

多个的

数据-允许-重新排序='真'

数据最大文件大小='3MB '

data-max-files=' 3 ' filepend . register plugin(

文件本地插件最小化预览,

文件本地插件最小化导入方向,

FilePondPluginFileValidateSize,

文件本地插件最小化编辑

);

文件池. create(

document.querySelector('input '),

//使用Doka.js作为图像编辑器

imageediteditor : Doka . create({ 0

utils: ['裁剪','滤镜','颜色']

})

);将多重属性添加到文件输入以创建多文件放置区域。使用data max files属性来限制文件的最大数量。拖放图像,文件池将呈现快速预览。还可以修正手机照片的位置信息。您可以重新排序文件,抓取文件并将其拖到新位置。

00-1010多种输入格式支持目录,文件,blob,本地网址,远程网址和数据URIs。

多个文件源删除文件,从文件系统中选择文件,使用应用编程接口添加文件,或者复制和粘贴文件。

或者异步同步上传,使用XMLHttpRequest或store将文件发送到服务器,使用File Encode插件将表单帖子提交为base64。

高可靠性由AT软件如VoiceOver和JAWS进行测试。文件池的用户界面可以通过键盘进行导航。

对可用空间的响应性自动缩放。它可以在移动和桌面设备上使用。

拖放以重新排列文件还支持以下附加功能。

修改标签和图标

多文件或单文件模式

从丢弃的文件夹中过滤文件

还原临时服务器文件

捕获页面上丢弃的文件

删除时上传或等待用户操作。

限制降落区的高度

删除以替换当前文件。

复制并粘贴文件

向文件添加元数据

使用插件扩展文件池

输入文件大小限制。

限制所有文件的总大小

限制可以添加的文件类型

显示图像文件的预览。

以固定比例裁剪图像。

调整图像大小以适合边界框。

强制将图像调整到特定大小

在客户端上应用图像转换

压缩JPEG图像

将图像转换为JPEG或PNG

信息读取方向图像

Base64编码文件

示例实现

文件池是一个值得尝试的工具。在文件上传体验上比很多第三方插件好很多,功能也不错。好好享受吧!

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。