首页 | 4584 | 733 | 366 | 添加收藏 上一个 下一个
文件拖拽上传插件DropzoneJS

DropzoneJS


DropzoneJS是一个提供文件拖拽上传并且提供图片预览的开源类库, 它是轻量级的,不依赖任何其他类库(如JQuery)并且高度可定制.


下载单独的 dropzone.js 并像下面这样在文件中引入:


<script src="./dist/dropzone.js"></script>

**用法 **


使用dropzone的典型方式是通过创建一个 class 属性中包含 dropzone 的form 表单元素


<form action="/file-upload"
      class="dropzone"
      id="my-awesome-dropzone">
</form>

<script>
    var myDropzone = new Dropzone("div#myId", { url: "/file/post"});
</script>

<script>
var myDropzone = new Dropzone("div#myId", { url: "/file/post"});
</script>

案例


$("#doc_area").dropzone({
    url: url, //上传地址         
    method: method, //方式        
    addRemoveLinks: true,
    maxFiles: 10,
    maxFilesize: 512,
    uploadMultiple: false,
    parallelUploads: 100,
    previewsContainer: false,
    acceptedFiles: ".pdf, .doc,.txt,.docx,.xlsx,.xls",
    success: function(file, response, e) {
        var res = JSON.parse(response);
        $(".div").append(str);
    }
});