jQuery ajaxForm 触发文件上传到 div 上的文件拖放答案

【问题标题】：jQuery ajaxForm trigger file upload on file drop over divjQuery ajaxForm 触发文件上传到 div 上的文件拖放
【发布时间】：2013-11-20 18:56:47
【问题描述】：

我使用jquery表单插件进行ajax文件上传，如下所示：

  <form enctype="multipart/form-data" action="upload.php" id="form" method="post">
    <input type="file" name="upfile" size="44" />
    <input name="submit" type="submit" id="upload" value="Upload" enabled>
  </form>

接下来这个魔法让它发挥作用：

// ... lots of option for begin, progress, complete events ...
$("#form").ajaxForm(options);

现在的问题，我想使用 onDrop 事件来处理文件上传，到目前为止我所拥有的：

dz.addEventListener('drop', function(e){
  FileDropHandler(e); // to prevent file download
  $('#dropzone').removeClass('over');

  var files = event.dataTransfer.files;
  alert(JSON.stringify(files[0]));

}, false);

那么现在，我如何告诉 ajaxForm 使用丢弃的文件进行上传？

【问题讨论】：

标签： jquery ajax upload

【解决方案1】：

文件拖放后，保存变量files，以便稍后从您的ajaxSubmit 访问。然后只需将其发送为extra data

$(this).ajaxSubmit({
    data: {files:files}
})

【讨论】：