Php 带预览的Ajax文件上载

我的脚本工作不正常，有问题。 我试图实现的是，当您浏览要上载的文件并选择“确定”以上载时，事件顺序应如下所示：

进度条向上移动30px和fadeIn

显示上传进度

完全向下移动30px并渐弱

预览上传的图像fadeIn

关闭图像并在新选择上重复上述操作

我的脚本出现问题，请参见以下内容：

未显示另一次上载的进度条

进度条不向上移动，并逐渐消失

Service.php

// File object 
$file = $_FILES['photo'];

// File types allowed to be uploaded
$file_types_allowed = array("image/gif", "image/jpeg", "image/jpg", "image/pjpeg", "image/png", "image/x-png");         

// Check if image is allowed
if (in_array($file["type"], $file_types_allowed))  {                
  if ($file["error"] > 0) {
    echo "Return Code: " . $file["error"] . "<br />";
  }
  else {
    // TODO: resize image
    // Save image in uploads folder
    $path = 'uploads/' . $file["name"];

    move_uploaded_file($file["tmp_name"], $path) or error('receiving directory insuffiecient permission', $path);       
    echo $path;
  }

} else {
  // Return error  
  echo "An error has occured - the file is invalid";
}           

?>

//文件对象
$file=$_文件['photo']；
//允许上载的文件类型
$file_types_allowed=数组（“image/gif”、“image/jpeg”、“image/jpg”、“image/pjpeg”、“image/png”、“image/x-png”）；
//检查是否允许使用图像
如果（在数组中（$file[“type”]，$file\u types\u允许））{
如果（$file[“error”]>0）{
回显“返回代码：”.$file[“error”]。“
”；
}
否则{
//TODO:调整图像大小
//将图像保存在上载文件夹中
$path='uploads/'。$file[“name”]；
移动上传的文件（$file[“tmp\u name”]，$path）或错误（$path，接收目录权限不明确）；
echo$path；
}
}否则{
//返回错误
echo“出现错误-文件无效”；
}           
?>

---

演示：

已经有了一些非常强大的文件上传实用程序，因此无需重新发明轮子：）您查看了jQuery文件上传的示例了吗？（谷歌it）