首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >使用Dropzone.js的非ajax post

使用Dropzone.js的非ajax post
EN

Stack Overflow用户
提问于 2014-05-18 05:01:26
回答 2查看 11.8K关注 0票数 19

我想知道是否有任何方法可以让Dropzone.js (http://dropzonejs.com)使用标准的浏览器帖子而不是AJAX。

是否可以在提交前将输入type=file注入到DOM中?

EN

回答 2

Stack Overflow用户

发布于 2014-05-20 21:13:24

所以,如果我没理解错的话,你想在提交激活了dropzone的表单之前添加一些数据(input=file),对吧?

如果是这样,我不得不做几乎同样的事情,我通过监听事件得到了它。如果你只上传一个文件,你应该监听“发送”事件,但如果你想开启多个上传,你应该监听"sendingmultiple“。下面是我用来实现这一点的一段代码:

Dropzone.options.myAwesomeForm = {
  acceptedFiles: "image/*",
  autoProcessQueue: false,
  uploadMultiple: true,
  parallelUploads: 100,
  maxFiles: 100,

  init: function() {
    var myDropzone = this;

    [..some code..]

    this.on("sendingmultiple", function(files, xhr, formData) {
      var attaches = $("input[type=file]").filter(function (){
        return this.files.length > 0;
      });

      var numAttaches = attaches.length;

      if( numAttaches > 0 ) {
        for(var i = 0; i < numAttaches; i++){  
          formData.append(attaches[i].name, attaches[i].files[0]);
          $(attaches[i]).remove();
        }
      }
    });

    [..some more code..]

  }
}

就是这样。我希望它对您有所帮助:)

PS:如果有任何语法错误,我很抱歉,但英语不是我的母语

票数 0
EN

Stack Overflow用户

发布于 2016-12-15 18:18:56

这是我在过去的项目中使用的,

function makeDroppable(element, callback) {

var input = document.createElement('input');

input.setAttribute('type', 'file');

input.setAttribute('multiple', true);

input.style.display = 'none';

input.addEventListener('change', triggerCallback);

element.appendChild(input);

element.addEventListener('dragover', function(e) {

e.preventDefault();

e.stopPropagation();

element.classList.add('dragover');
});

element.addEventListener('dragleave', function(e) {

e.preventDefault();

e.stopPropagation();

element.classList.remove('dragover');
});

element.addEventListener('drop', function(e) {

e.preventDefault();

e.stopPropagation();

element.classList.remove('dragover');

triggerCallback(e);
});

element.addEventListener('click', function() {
input.value = null;
input.click();
});

function triggerCallback(e) {

  var files;

  if(e.dataTransfer) {

  files = e.dataTransfer.files;

} else if(e.target) {

  files = e.target.files;
}
callback.call(null, files);
}
}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/23716048

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档