javascript - 在 HTML 页面上添加更多文件

Question

我见过一些网站，其中有一个框供用户浏览要上传的文件，然后是“添加更多文件”链接。当用户单击链接时，会出现另一个框，允许用户选择另一个文件。用户可以点击“添加更多文件”继续添加框。他们怎么做到的？

我使用 Ruby on Rails 作为我的后端。

score 1 · Accepted Answer

<div id="filePickers">
  <input type="file" name="files[]">
  <input type="file" name="files[]">
  <input type="file" name="files[]">
</div>

params[:files]当发布到您的服务器时，它将显示为一组文件。

如果您想要更多，请将一些 Javascript 绑定到某处的按钮以添加新输入。

// jQuery for brevity
$('#filePickers').append('<input type="file" name="files[]">');

score 0 · Accepted Answer

这是一个 HTML5“拖放上传”，基于两个 HTML5 API：

您可以在此处找到手动实现它的教程

但是您宁愿使用已经实现它的库，例如jquery-filedrop

2 回答 2