HTML5拖放和多个文件上传 [英] HTML5 drag and drop and multiple file upload

查看:164
本文介绍了HTML5拖放和多个文件上传的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个HTML表单,其中包含一个包含多个文件选择的文件输入字段,并且我还具有我正在处理的拖放功能。我的问题是如何可以无缝集成这两个功能,如果它是可能的?

I have an HTML form that contains a file input field with multiple file selection and I also have a drag and drop feature that I am working on as well. My question is how to integrate both of these features seamlessly if it is even possible?

理想情况下,我希望用户通过drag'n'drop选择他们的文件或通过文件对话框。一旦用户完成选择他们的文件,点击表单提交按钮进行上传。

Ideally, I would like the user to select their files either through drag'n'drop or through the file dialog box. Once the user is done selecting their files, click the form submit button to upload.

我想我的主要不确定性是如何绑定被拖动的文件和下载到一个文件输入字段进行表单提交。

I guess the main uncertainty that I have is how to bind the files that were dragged and dropped to a file input field for form submission.

推荐答案

<input type=file multiple>
<div id='dropzone'>Drop Files Here</div>

onchange和ondrop事件会将函数与变量绑定以获取文件列表。

onchange and ondrop events shuld bind a function with the variable to get file list.

var files=e.target.files||e.dataTransfer.files

阅读此

这篇关于HTML5拖放和多个文件上传的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆