Javascript 使用Ajax上传文件

我已经尝试了几种不同的方法（基于文章和其他SO论坛）来实现这一点，并且我已经将范围缩小到当我尝试将表单数据发送到我的PHP脚本时数据丢失的事实。当我回显$_FILES[“file”][“name”]时，它是空的

我已经测试过了，我的ajax和php脚本是连接在一起的，因为我可以返回一些数据，而不是任何表单数据。这显然会导致文件无法上传

我当前的代码参考了这个论坛（lee8oi的答案）： 我开始了一个新的论坛，因为这个问题是6年前提出的

html:

php:

if（$\u POST[“label”]）{
$label=$_POST[“label”]；
}
$allowedExts=数组（“gif”、“jpeg”、“jpg”、“png”）；
$temp=explode（“.”，$_文件[“文件”][“名称”]）；
$extension=end（$temp）；
如果（（$_文件[“文件”][“类型”]=“图像/gif”）
||（$_文件[“文件”][“类型”]=“图像/jpeg”）
||（$_文件[“文件”][“类型”]=“图像/jpg”）
||（$_文件[“文件”][“类型”]=“图像/pjpeg”）
||（$_文件[“文件”][“类型”]=“图像/x-png”）
||（$_文件[“文件”][“类型”]=“图像/png”））
&&（$_文件[“文件”][“大小”]<200000）
&&in_数组（$extension$allowedExts））{
如果（$\u文件[“文件”][“错误”]>0）{
回显“返回代码：”.$\u文件[“文件”][“错误”]。
”；
}否则{
$filename=$label.$\u文件[“文件”][“名称”]；
echo“上传：.”文件[“文件”][“名称”]。“
”；
echo“Type:”.$\u文件[“file”][“Type”]。“
”；
回显“大小：”（$_文件[“文件”][“大小”]/1024）。“kB
”；
回显“临时文件：”.$\u文件[“文件”][“tmp\u名称”]。
”；
如果（文件_存在（“上传/”$filename））{
echo$filename。“已存在。”；
}否则{
移动上传的文件（$文件[“文件”][“tmp文件名”]，
“上传/”$filename）；
echo“存储在：“.”uploads/“$filename中；
}
}
}否则{
echo$_文件[“文件”][“名称”]；
}

我想您只需要更改以下行

var fd = new FormData( $('#signUpForm') );

到

或

FormData的构造函数需要本机表单元素，而不是jQuery对象。所以

document.getElementById（'signUpForm'）

，

$（'signUpForm'）[0]

，和

这一切都会起作用

这提供了进一步的解释。
我认为您只需要更改以下行

var fd = new FormData( $('#signUpForm') );

到

或

FormData的构造函数需要本机表单元素，而不是jQuery对象。所以
document.getElementById（'signUpForm'）
，
$（'signUpForm'）[0]
，和
这一切都会起作用

这提供了进一步的解释。
回答得好，我投了更高的票，因为比我的好。你搞定了回答得好，我投了赞成票，因为比我的好。你搞定了
   if ($_POST["label"]) {
      $label = $_POST["label"];
    }
    $allowedExts = array("gif", "jpeg", "jpg", "png");
    $temp = explode(".", $_FILES["file"]["name"]);
    $extension = end($temp);
    if ((($_FILES["file"]["type"] == "image/gif")
    || ($_FILES["file"]["type"] == "image/jpeg")
    || ($_FILES["file"]["type"] == "image/jpg")
    || ($_FILES["file"]["type"] == "image/pjpeg")
    || ($_FILES["file"]["type"] == "image/x-png")
    || ($_FILES["file"]["type"] == "image/png"))
    && ($_FILES["file"]["size"] < 200000)
    && in_array($extension, $allowedExts)) {
        if ($_FILES["file"]["error"] > 0) {
            echo "Return Code: " . $_FILES["file"]["error"] . "<br>";
        } else {
            $filename = $label.$_FILES["file"]["name"];
            echo "Upload: " . $_FILES["file"]["name"] . "<br>";
            echo "Type: " . $_FILES["file"]["type"] . "<br>";
            echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
            echo "Temp file: " . $_FILES["file"]["tmp_name"] . "<br>";

            if (file_exists("uploads/" . $filename)) {
                echo $filename . " already exists. ";
            } else {
                move_uploaded_file($_FILES["file"]["tmp_name"],
                "uploads/" . $filename);
                echo "Stored in: " . "uploads/" . $filename;
            }
        }
    } else {
        echo $_FILES["file"]["name"];
    }

var fd = new FormData( $('#signUpForm') );

var fd = new FormData( $('#signUpForm')[0] );

var fd = new FormData(this);