zoukankan      html  css  js  c++  java
  • dropZone 回显图片

    初始化dropzone的图片信息

    var dropVar = this;
    var mockFile = {
        name: "myiamge.jpg", //需要显示给用户的图片名
        size: 12345, //图片尺寸
        height:200,
        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

  • 相关阅读:
    主席树学习笔记(静态区间第k大)
    p1156 题解(未完全解决)
    树上神奇 逆 逆序对(我的叫法)hh的小纸条 重中之重!!!!!
    二叉查找树学习笔记(BST)
    负环...坑点
    差分约束系统学习笔记
    tarjan学习(复习)笔记(持续更新)(各类找环模板)
    分层图食用简介
    js数组方法
    灵动标签调用父栏目下的所有文章
  • 原文地址:https://www.cnblogs.com/xiaofenguo/p/7060308.html
Copyright © 2011-2022 走看看