悬浮窗删除以前的图像

我需要帮助的回答上一个问题 How to limit the number of dropzone.js files uploaded?悬浮窗删除以前的图像

，那里有一个解决方案中使用

Dropzone.options.myAwesomeDropzone = { 
    accept: function(file, done) { 
    console.log("uploaded"); 
    done(); 
    }, 
    init: function() { 
    this.on("addedfile", function() { 
     if (this.files[1]!=null){ 
     this.removeFile(this.files[0]); 
     } 
    }); 
    } 
};

但作为一个js numpty，我不知道在哪里放置这个。我假设我的表单必须具有id myAwesomeDropzone，并且上面的代码需要插入到dropzone.js文档中，但是在哪里？如果您可以提供'之后'和'之前'或请替换答案。

如果有人能给我一些指针，它会很棒。

我的声望低于50，所以我无法对原始主题发表评论。如果我发布这个作为新主题是错误的，请管理员不要惩罚我并关闭它，而是移动它或做任何事情来让人们提供帮助。

干杯安迪

来源

2014-05-22 Andy Hickey

HTML表单应该像下面。请注意，

类= “悬浮窗”

和

ID = “我-悬浮窗”

“我 - 悬浮窗” ID是很重要的， DropZone将此视为“myDropzone”（连字符已删除并显示）。所以当你在DropZone.options中引用这个ID时，它应该是“myDropzone”。这个非常重要。

<div> 
    <form action="/file-upload" class="dropzone" id="my-dropzone" style="border:2px dotted #337ab7"> 
     <div class="dz-message"> 
     Drag n drop photos here or click to upload. 
     <br /> 
     <span class="note">(The photos are uploaded to twitter only when the tweet is sent.)</span> 
     </div> 
    </form> 
</div>

你应该链接的CSS和JS文件在HTML页面中，像这样

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

在页面加载，你应该初始化您的JS代码的悬浮窗的配置为你的页面，如下。我限制dropzone只接受一个文件，其大小不应超过5MB。

self.options.maxFilesize = 5; self.options.maxFiles = 1;

Dropzone.autoDiscover = false; 
Dropzone.options.myDropzone = { 
    init: function() { 
    var self = this; 
    // config 
    self.options.addRemoveLinks = true; 
    self.options.autoProcessQueue = false; 
    self.options.maxFilesize = 5; 
    self.options.maxFiles = 1; 
    self.options.dictFileTooBig = 
     "Twitter do not allow files greater than 5MB."; 
    //New file added 
    self.on("addedfile", function(file) { 
     console.log('new file added ', file.path); 
    }); 
    self.on("maxfilesexceeded", function(file) { 
     alert(
     "Only one photo can be attached with the tweet." 
    ); 
    }); 

    } 
};

现在，当你的页面加载，你会看到形式&得到拖N的你的DIV拖放功能。

要访问这些文件，您可以在javascript中的某些按钮单击事件中执行下面的操作。

// to get queued files 
var myDropzone = Dropzone.forElement("#my-dropzone"); 
var files = myDropzone.getQueuedFiles();

来源

2015-07-23 22:36:30 cherit

悬浮窗删除以前的图像

回答

相关问题