dropZone 回显图片

初始化dropzone的图片信息

var dropVar = this;
var mockFile = {
    name: "myiamge.jpg", //需要显示给用户的图片名
    size: 12345, //图片尺寸
    height:200,
    width:200,
    type: '.jpg,.png,.gif'//图片文件类型
};
dropVar.addFile.call (dropVar,mockFile);//添加mock图片到显示区域
dropVar.options.thumbnail.call (dropVar,mockFile,"http://localhost:8181/dsp-mgr/assets/images/logo.png");//添加数据源给mock图片

<script type="text/javascript">

Dropzone.autoDiscover = false;

var myDropzone = new Dropzone("#drop", {

url: "/",//上传文件的地址，

maxFiles: 1,//最多上传几个图片

maxFilesize: 5,//图片的大小，单位是M

addRemoveLinks:true,

dictRemoveFile : "删除",

dictCancelUpload: "取消",

acceptedFiles: ".jpg,.jpeg,.png,.gif",//支持的格式

paramName:"dropimage",//上传的FILE名称，即服务端可以通过此来获取上传的图片

dictDefaultMessage: "<button class='btn btn-default btn-flat' type='button'>点击上传图片</button>",

dictMaxFilesExceeded: "只能上传1个文件",

init: function() {

this.on("success", function(file,xhr) {

console.log(xhr);

});

this.on("removedfile", function(file) {

console.log("File " + file.name + "removed");

});

}

});

var mockFile = { name: "123.jpg", accepted:true };

myDropzone.emit("addedfile", mockFile);

myDropzone.emit("thumbnail", mockFile, "http://edms.kitesky.com/upload/image/20170422/52edf3c2aabf171315d968d9af814d0c.jpg");

myDropzone.emit("complete", mockFile);

<!-- myDropzone.options.maxFiles = myDropzone.options.maxFiles - 1; -->

</script>

dropzone 参考信息网站

1 http://www.dropzonejs.com

2 http://www.tuicool.com/articles/M36jI3m

3 http://blog.csdn.net/yangxujia/article/details/36672917