用于选择多个文件的输入文件 HTML 像 facebook 或 Google？答案

【问题标题】：INPUT FILE HTML for select multiple files Like facebook or Google?用于选择多个文件的输入文件 HTML 像 facebook 或 Google？
【发布时间】：2010-11-01 01:30:25
【问题描述】：

如何选择多个文件进行上传，例如 Facebook、Gmail 或 Flickr？

<button>Upload files</button>

当您按下上传文件按钮时，会出现 OpenDialogBox，您可以使用 CTRL 键选择多个文件...然后按打开并开始上传...

谢谢！

【问题讨论】：

Gmail like file upload with jQuery的可能重复

标签： php javascript jquery html xml

【解决方案1】：

右键点击gmail中的附加链接，你会看到你的邪恶朋友闪现。

【讨论】：

【解决方案2】：

这个例子不会在你提交表单之前开始上传，但是我会把它放在一起，以防你只想用一个表单提交上传多个文件（使用 jQuery）。

如果您正在寻找 Flash 脚本，我使用“uploadify”取得了不错的效果（请注意，Flash 不处理 Session 变量）。

我喜欢使用 jQuery clone() 函数。它使事情变得简单。

这在你的表单中：

<div id="Uploadcontainer">
   <input type="file" name="uploadfiles[]" class="uploadfile" />
</div>
<a id="extraUpload" href="#">Add another field</a>

这适用于 jQuery：

/**********************
    FILE UPLOAD
***********************/    
$(document).ready(function(){   
      $("#extraUpload").click(function () {
      $('.uploadfile:last').clone().appendTo('#Uploadcontainer').val("");      
       return false;
  });
  });

当点击 id extraUpload (#extraUpload) 的链接时，文档对象模型中的最后一个元素（DOM，或“html 页面”上的最后一个元素）与 uploadfile ( .uploadfile:last) 与 clone()... 重复并添加到 div 的末尾 #Uploadcontainer 与 appendTo()... 然后，添加的输入字段的值使用 val() 变为空白任何值。

【讨论】：