文章/答案/技术大牛

发布

社区首页 >问答首页 >Dropzone.js缩略图事件

问Dropzone.js缩略图事件
EN

Stack Overflow用户

提问于 2017-11-24 10:16:13

回答 1查看 5.2K关注 0票数 3

我使用JQuery框架"Dropzone.js“在服务器上上传文件。

我想在缩略图显示的时候做些事情。其他的事情都没有问题。DOM在javascript调用之前显示。

根据Dropzone.js文档的说法，我试图通过两种方式启动缩略图：

  var dz = new Dropzone(
   'div#'+id,
    {
    init: function() {
       this.on("thumbnail", function(file) {console.log("thumbnail") });
    },
...
  }

以及：

var dz =  new Dropzone(...);
dz.on("thumbnail", function(file) {
    console.log("thumbnail")
  });

当我将文件放到下拉区域时，浏览器控制台中没有显示任何内容。最奇怪的行为是，当我用事件addedfile (dz.on("addedfile", ...或init参数)编写相同的东西时，我有正确的行为:在添加文件时，我在控制台中写了一些东西。

注意，我希望在创建缩略图时动态修改它，这就是为什么我不能使用其他事件的原因。

我在我的Dropzone对象中使用了一个自定义的previewTemplate；我不认为这是问题的原因，但在怀疑中，我也发布了我为这个参数所写的内容：

previewTemplate : '<div class="dz-preview dz-file-preview ">'
 + '<div class="dz-details">'
   + '<div class="dz-cancel" title="Supprimer">X</div>'
   + '<div class="dz-filename"><span data-dz-name></span></div>'
   + '<div class="dz-size" data-dz-size></div>'
 + '</div>'
 + '<div class="dz-progress"><span class="dz-upload" data-dz-uploadprogress></span><span class="dz-upload-text" data-dz-uploadprogress></span></div>'
 + '<div class="dz-error-message"><span data-dz-errormessage></span></div>'
+ '</div>',

如果有人知道发生了什么，我如何解决它，我非常感谢！

评论后的编辑

好吧，那么，谢谢大家的评论。我想我知道我误解了什么地方，更仔细地阅读这位医生，这就是问题所在：

它们所做的事情包括:创建一个新的HTML元素，在提供图像数据时添加元素(带有缩略图事件)，

只有当我们希望在缩略图中显示图像时，才会触发此事件；但我所做的是没有图像的缩略图(只是文件的名称和大小)。这是正确的，当我在模板中添加createImageThumbnails标志和<img data-dz-thumbnail />时，当我在drop区域中添加一个图像文件时会触发该事件。

所以，我的新问题是:当创建自由图像缩略图时，如何显示事件？我认为在使用uploadprogress事件时，它不会在文件未发送时触发(例如，当激活最大文件大小限制时)。

javascript

jquery

dropzone.js

回答 1

Stack Overflow用户

发布于 2017-12-02 13:51:01

我不确定你用得对不对。我将尝试以下方法：

var dz =  new Dropzone(...);

Dropzone.options.dz = {
 init: function() {
    this.on("thumbnail", function(file) { console.log("thumbnail") });
  }
};

如果事件做了你希望它做的事情，则是另一回事。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/47471012

复制

相似问题

问Dropzone.js缩略图事件
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Dropzone.js缩略图事件EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Dropzone.js缩略图事件
EN