Dropzone.js官网

官网：

https://www.dropzonejs.com/

github:

https://github.com/enyo/dropzone

先去官网或者git下载css文件和js文件

引入css和js

<link rel="stylesheet" type="text/css" href="basic.css">
<link rel="stylesheet" type="text/css" href="dropzone.css">
<script src="dropzone.js"></script>

基本使用

<form action="/上传地址"
      class="dropzone"
      id="my-awesome-dropzone"></form>

高级使用（下文均是高级使用示例）

<div class="myId" class="dropzone"></div>

必须加上这句

Dropzone.options.myAwesomeDropzone = false;

或者

Dropzone.autoDiscover = false;

否则会报错提示：

dropzone.js:1007 Uncaught Error: Dropzone already attached.

不使用jquery

Dropzone.autoDiscover = false;
// Dropzone class:
var myDropzone = new Dropzone("div#myId", { url: "/file/post"});

使用jquery

先引入jquery.js

<script src="jquery.js"></script>

Dropzone.autoDiscover = false;
// jQuery
$("div#myId").dropzone({ url: "/file/post" });

本文仅供基本使用写法

详情参考官网文档：

https://www.dropzonejs.com/