使用 PHP 和 HTML 使用进度条上传多个文件

Question

我最近创建了一个脚本，允许人们使用 PHP 后端和 HTML 表单上传多个文件。我想实现一个进度条，以便用户在上传多个文件时不会两次单击上传按钮。如果可能，我想避免使用 javascript 或 ajax，但同时我希望跨浏览器兼容。

这是我的 html 表单数据：

<form enctype="multipart/form-data" action="uploader.php" method="POST">
Choose Course Code:
<select name="subject_list">
<option value="ACC 100">ACC 100</option>
<option value="ACC 406">ACC 406</option>
<option value="ECN 104">ECN 104</option>
<option value="ECN 204">ECN 204</option>
<option value="FIN 300">FIN 300</option>
<option value="GMS 200">GMS 200</option>
<option value="ITM 100">ITM 100</option>
<option value="ITM 301">ITM 301</option>
<option value="ITM 305">ITM 305</option>
<option value="ITM 330">ITM 330</option>
<option value="ITM 350">ITM 350</option>
<option value="ITM 407">ITM 407</option>
<option value="ITM 500">ITM 500</option>
<option value="ITM 501">ITM 501</option>
<option value="ITM 505">ITM 505</option>
<option value="ITM 600">ITM 600</option>
<option value="LAW 122">LAW 122</option>
<option value="SSH 105">SSH 105</option>
<option value="Other">Other</option>
</select><br>
Choose a file to upload (Max 500MB): <input name="rye_file[]" type="file" id="file_style" multiple />
<input type="submit" name="submit" value="Upload" />
</form> 
<form action="/logout.php">
<input type="submit" value="Logout">
</form>

这是我的后端：

<?php
$subject_list = $_POST['subject_list'];
$uploaddir = "/var/www/fixnode_website/content/Secure Login/Rye High/uploads/$subject_list";
$files=array();
$fdata=$_FILES['rye_file'];
if(is_array($fdata['name'])){
 for($i=0;$i<count($fdata['name']);++$i){
  $files[]=array(
   'name'     => $fdata['name'][$i],
   'tmp_name' => $fdata['tmp_name'][$i],
  );
 }
}
else $files[]=$fdata;

foreach ($files as $file) {
  // uploaded location of file is $file['tmp_name']
  // original filename of file is $file['name']
  $move_file = move_uploaded_file($file['tmp_name'], "$uploaddir/".$file['name']);
}
if($move_file){
   echo "File is valid, and was successfully uploaded to: $subject_list folder. Please wait, your browser will refresh in 5-10 seconds!";
   header('Refresh: 10; URL=/index.php');
  } 
  else {
     echo "Upload failed";
 }
?>

Answer 1

这可能不是你想要的，但我建议你试试

1. 上传http://www.uploadify.com [免费]，还有一个html5 版本。有时，我尽量不重新发明轮子。
2. 如果您担心上传费用，blueimp 怎么样 http://blueimp.github.com/jQuery-File-Upload/
3. 非常喜欢HTML5，试试 http://www.igloolab.com/jquery-html5-uploader/ （您可以通过 Tweet 或 Facebook 帖子为这个付费。这有多棒？）
4. 其他一些选项： http://www.fyneworks.com/jquery/multiple-file-upload/
5. 价值：https://github.com/valums/file-uploader（fine_uploader 可一次性支付 15 美元）- 有意义。

请注意，如果您同意的话，您必须使用 Jquery。