Dropzone JS 使用指南（文件拖拽上传）

JavaScript 文件拖拽上传插件 dropzone.js 介绍 [url]https://www.renfei.org/blog/dropzone-js-introduction.html[/url]
DropzoneJS 使用指南（文件拖拽上传） [url]http://www.open-open.com/lib/view/open1448610841329.html[/url]


后台资料：
基于Spring MVC的Web应用开发(4) - FileUpload [url]http://stephansun.iteye.com/blog/1458980[/url]

使用例子

$("#dropzone2 .dropzone").dropzone({
            headers: {},
            paramName: "file", // The name that will be used to transfer the file
            maxFiles: 1,
            maxFilesize: 10.5, // MB
            addRemoveLinks: true,
            //acceptedFiles: ".jpg,.png,.gif,.mp3",
            acceptedFiles: ".jpg,.png,.gif",
            dictRemoveFile: "删除",
            dictMaxFilesExceeded: "只能上传{{maxFiles}}个",
            dictInvalidFileType:"无效文件",
            dictCancelUpload:"取消上传",
            dictDefaultMessage: '<span class="bigger-150 bolder"><i class="icon-caret-right red"></i> Drop files</span> to plupload \
                <span class="smaller-80 grey">(or click)</span> <br /> \
                <i class="plupload-icon icon-cloud-plupload blue icon-3x"></i>'
            ,
            dictResponseError: '上传出现错误',
            previewTemplate: "<div class=\"dz-preview dz-file-preview\">\n  <div class=\"dz-details\">\n    <div class=\"dz-filename\"><span data-dz-name></span></div>\n    <div class=\"dz-size\" data-dz-size></div>\n    <img data-dz-thumbnail />\n  </div>\n  <div class=\"progress progress-small progress-striped active\"><div class=\"progress-bar progress-bar-success\" data-dz-uploadprogress></div></div>\n  <div class=\"dz-success-mark\"><span></span></div>\n  <div class=\"dz-error-mark\"><span></span></div>\n  <div class=\"dz-error-message\"><span data-dz-errormessage></span></div>\n</div>",
            success: function (q, context, htx) {
                console.log($.toJSON(context));
                DropzoneUploadFiles2 = context;
                return q.previewElement.classList.add("dz-success")
            },
            removedfile: function (file) {
                console.log("File " + file.name + "被删除");
                var r;
                if ((r = file.previewElement) != null) {
                    r.parentNode.removeChild(file.previewElement)
                }
                return this._updateMaxFilesReachedClass()
            },
            init: function () {
                var myDropZone = this;
                $("#btnRemoveAll2").unbind("click").removeAttr("onclick").click(function () {
                    console.log("removeAllFiles");
                    myDropZone.removeAllFiles();
                });
                //最好在这里做这些事情
                this.on("addedfile", function(file) { alert("Added file."); });
                this.on("complete", function(file) { alert("complete file."); });
            }

        });

如何清除所有文件

$(function() {
            Dropzone.options.myAwesomeDropzone = { 
            init: function () {
                var myDropZone = this;
                //自定义一个隐藏按钮给私下调用
                $("#btnRemoveAll").click(function () {
                            myDropZone.removeAllFiles();
                        }
                );
            }

        };
 });

[color=red][b]附件是别人的一个后台例子[/b][/color]