上传文件插件dropzone的实例
html:
- <div class="field">
- <div id="file" class="dropzone">
- <div class="dz-message needsclick">
- <font><font>Drop files here or click to upload.</font></font><br>
- <span class="note needsclick">(Select the files you want to upload.)</span>
- </div>
- </div>
- </div>
css:
- .field{
- max-width:720px;
- margin: auto;
- margin-top:60px;
- font-size:20px;
- .dropzone{
- padding: 54px 54px;
- .dz-message{
- height:84px;
- font{
- line-height:28px;
- }
- span.note{
- height:28px;
- margin-top:28px;
- font-size:15px;
- }
- }
- }
- }
js:
- Dropzone.autoDiscover = false;
- var dropz = new Dropzone("#file", {
- url: "uploadFile", //上传文件的接口
- parallelUploads:,//并行处理多少个文件上传
- uploadMultiple:true,//允许dropzone一次提交多个文件
- maxFiles: ,//最大可上传的文件个数
- maxFilesize: ,//MB
- acceptedFiles: ".csv", //可接受的文件类型
- success:function(file,data){
- // console.log(this.getAcceptedFiles().length);//获取上传的文件总数
- data=JSON.parse(data);
- if(data.code==''){
- //成功
- }else{
- }
- },
- dictMaxFilesExceeded:"文件数量过多",
- dictDefaultMessage:"Drop files here or click to upload.",
- dictFileTooBig:"可添加的最大文件大小为{{maxFilesize}}Mb,当前文件大小为{{filesize}}Mb ",
- })
dropzone需要注意的一点就是:
打开文件的那一刻,就已经开始上传了
官网地址:http://www.dropzonejs.com/
上传文件插件dropzone的实例的更多相关文章
- Uploadify 上传文件插件详解
Uploadify 上传文件插件详解 Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示.不过官方提供的实例时php版本的,本文将详细介绍Uploadify在Aspnet中 ...
- 项目一:第四天 1、快递员的条件分页查询-noSession,条件查询 2、快递员删除(逻辑删除) 3、基于Apache POI实现批量导入区域数据 a)Jquery OCUpload上传文件插件使用 b)Apache POI读取excel文件数据
1. 快递员的条件分页查询-noSession,条件查询 2. 快递员删除(逻辑删除) 3. 基于Apache POI实现批量导入区域数据 a) Jquery OCUpload上传文件插件使用 b) ...
- 使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能。并且在界面上有radio 的选择内容也要上传
使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能.并且在界面上有radio 的选择内容也要上传 uploadify 插件的 下载和文档地址 ...
- uploadify 上传文件插件
今天在项目中要用到文件上传功能时,想借助Jquery方式来实现,于是想到用uploadify插件来实现.不经意间在网上看到了一遍关于这个插件的用法,写的很好.在这里就分享给大家,希望对大家有帮助.以下 ...
- Ajax 无刷新上传文件插件 uploadify 的使用
在表单中无法直接使用 Ajax 上传文件,解决的思路可以是使用插件无刷新地上传文件,返回文件上传后的地址,然后把该地址作为 Ajax 的参数传递给服务器端进行数据库处理.可以使用 uploadify ...
- 【Bootstrap】bootstrap-fileinput上传文件插件
[bootstrap-fileinput] 这是个据传最好用的bootstrap相关联的文件上传控件,支持拖曳上传,多线程上传,上传文件预览等等功能. 首先还是说一下要引入的一些文件: <lin ...
- php 应用 bootstrap-fileinput 上传文件 插件 操作的方法
//先加载插件所需要的 js .css 文件 <link href="css/fileinput.css" rel="stylesheet" type=& ...
- Xshell拖拽上传文件插件
lrzsz是一款在linux里可代替ftp上传和下载的程序.在linux中支持直接拖拽上传的插件:同时也支持rz和sz进行命令上传和下载. 插件安装 yum -y install lrzsz 上传(r ...
- jQuery 自制上传头像插件-附带Demo实例(ajaxfileupload.js第三弹)
这篇文章主要是对前两篇关于ajaxfileupload.js插件的文章 <ASP.NET 使用ajaxfileupload.js插件出现上传较大文件失败的解决方法(ajaxfileupload. ...
随机推荐
- java中的自动转型的学习理解
java当中的继承是和c++中的继承类似,只是java中的继承时的父类只能有一位. 我们今天在这里讲的是关于java中的自动转型的理解:顾名思义,自动转型值得就是使用时自动的将自身的类型进行转化. 自 ...
- Python 面向对象 (进阶篇)
<Python 面向对象(初级篇)>文章介绍了面向对象基本知识: 面向对象是一种编程方式,此编程方式的实现是基于对 类 和 对象 的使用 类 是一个模板,模板中包装了多个“函数”供使用(可 ...
- PL/SQL批处理语句(一)BULK COLLECT
我们知道PL/SQL程序中运行SQL语句是存在开销的,因为SQL语句是要提交给SQL引擎处理,这种在PL/SQL引擎和SQL引擎之间的控制转移叫做上下文却换,每次却换时,都有额外的开销.然而,FORA ...
- day17-jdbc 3.jdbc快速入门
通过java程序操作数据库. 对数据库操作是对记录的操作.记录就是DML和DCL. 只要Java程序跟任何设备进行了连接,用完之后必须释放资源.最简单基础班讲I/O流,Java跟文件进行了连接,用完之 ...
- 【总结整理】js获取css的属性(内部,外部,内嵌(写在tag中))
在JS中需要获取某个元素的宽高或者是绝对定位的位置信息,通常我们会这么写: var elemWidth = elem.style.width; console.log(elemWidth); //(空 ...
- array_unique() 函数移除数组中的重复的值
array_unique() 函数移除数组中的重复的值,并返回结果数组. 当几个数组元素的值相等时,只保留第一个元素,其他的元素被删除. 返回的数组中键名不变.
- UIActionSheet(操作列表)
#import "AppDelegate.h" @interface AppDelegate ()<UIActionSheetDelegate> @end @imple ...
- Configuration File (php.ini) Path Loaded Configuration File 都有加载php.ini文件,有什么不同的地方?
Configuration File (php.ini) Path /usr/local/php7/etc 这个目录下面也有php.ini文件(如果在编译./configure -with- ...
- 在Linux里安装jdk
一.系统环境说明: [操作系统]:Ubuntu 18.04.1 Desktop [JDK]:jdk1.8.0_181,文件名称:jdk-8u181-linux-x64.tar 二.准备jdk文件 下载 ...
- 利用General框架进行三层架构开发
三层架构是企业信息管理系统中一种比较流行的架构方式,如大家所知,三层架构将信息系统分为数据访问层(DAL).业务逻辑层(BLL).界面表示层(UI)三部分,三层架构的好处是根据系统中代码所处的层次将系 ...