Php 使用Ajax上载文件失败_Php_File Upload_Upload

Php 使用Ajax上载文件失败

php file-upload

Php 使用Ajax上载文件失败,php,file-upload,upload,Php,File Upload,Upload,我做了一个没有Ajax的小脚本来上传文件，当我添加Ajax时，它不起作用，当我检查结果时，我发现没有提交$\u文件数据： form.php <html xmlns="http://www.w3.org/1999/xhtml" dir="rtl"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javasc

我做了一个没有Ajax的小脚本来上传文件，当我添加Ajax时，它不起作用，当我检查结果时，我发现没有提交$\u文件数据：

form.php

<html xmlns="http://www.w3.org/1999/xhtml" dir="rtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  

<script type="text/javascript" src="../JS/jquery.js"></script>


<script type="text/javascript">

    $(document).ready(function(){

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $('#prevElem').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}

$("#imgInp").change(function(){
    readURL(this);

    // get natural (local) image height
    //var naturalH = document.querySelector('img#prevElem').naturalHeight;
    var naturalH = $('img#prevElem').height();
    alert(naturalH);
    $("span.imgH").append(naturalH);
    // get natural (local) image width
    var naturalW = document.querySelector('img#prevElem').naturalWidth;
    $("span.imgW").append(naturalW);

});


$('.submitFile').click(function(){


        var getData = $('.formUp').serialize();
        console.log(getData);
        var dataString = getData;
        //console.log(dataString);


    $.ajax({
    type: "POST",
    url: "upload.php",
    enctype: 'multipart/form-data',
    data: dataString,
    dataType: "json",
    success: function(data) {

         alert(data);

    } // end function
        }); // end ajax

    return false;
    });

});
</script>

</head>

<body>

<fieldset style="width: 700px; margin-right: auto; margin-left: auto; border-width: 0px;">

<form name="formUp" class="formUp" method="POST" action="upload.php" enctype="multipart/form-data">

<input type="hidden" name="MAX_FILE_SIZE" value="10000000" />

<input type='file' name="fileToUpload" id="imgInp" />
    <br>
    <div style="text-align: center;">
    <img id="prevElem" src="../Images/logo.png" />
    </div>
    Width : <span class="imgW"></span>
    <br />
    Height : <span class="imgH"></span>
<ul>

<li style="list-style: none;">
<span style="margin-right: 2em;">
<input type="submit" name="Send" class="submitFile" value="GO" />
</span>
<br />
</li>
</ul>
</form>
</fieldset>
  </body>
</html>

upload.php

<?php

print_r($_POST);

echo '<br />';
echo '<br />';

print_r($_FILES);

$fileToUpload = $_POST['fileToUpload'];

echo 'file '.$fileToUpload.'<br />';

$target_file = time();

if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
    echo "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been uploaded.";
} else {
    echo "Sorry, there was an error uploading your file.";
}

?>

<?php

$ImageType      = $_FILES['fileToUpload']['type']; //"image/png", image/jpeg etc.
$ImageTmp       = $_FILES["fileToUpload"]["tmp_name"];
$ImageSize      = $_FILES["fileToUpload"]["size"];
$ImageError     = $_FILES["fileToUpload"]["error"];

echo 'type '.$ImageType.'<br />';
echo 'tmp '.$ImageTmp.'<br />';
echo 'size '.$ImageSize.'<br />';
echo 'error '.$ImageError.'<br />';

$imginfo_array = getimagesize($ImageTmp);
print_r($imginfo_array);
// sample output:

/* Array
(
[0] => 642
[1] => 389
[2] => 3
[3] => width="642" height="389"
[bits] => 8
[mime] => image/png
)
*/

$target_file = time().'.png';

if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
    echo "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been uploaded.";
} else {
   echo "Sorry, there was an error uploading your file.";
}

?>

// serialize() will not work to get the file property
// formatage is the form id
        var fullData = new FormData(document.getElementById("formatage")); // formatage is the form id

// since we have the form information, and the variable "act" is not included in the form, we can append it to the form, first act is the property and the second one is the variable

        fullData.append('act', act);

    $.ajax({
    type: "POST",
    url: "Check.php",        
    enctype: 'multipart/form-data',
    contentType: false,
    processData: false,
    data: fullData,
    dataType: "json",

    success: function(data) {
// do some stuff here

<?php

$ImageType      = $_FILES['fileToUpload']['type']; //"image/png", image/jpeg etc.
$ImageTmp       = $_FILES["fileToUpload"]["tmp_name"];
$ImageSize      = $_FILES["fileToUpload"]["size"];
$ImageError     = $_FILES["fileToUpload"]["error"];

echo 'type '.$ImageType.'<br />';
echo 'tmp '.$ImageTmp.'<br />';
echo 'size '.$ImageSize.'<br />';
echo 'error '.$ImageError.'<br />';

$imginfo_array = getimagesize($ImageTmp);
print_r($imginfo_array);
// sample output:

/* Array
(
[0] => 642
[1] => 389
[2] => 3
[3] => width="642" height="389"
[bits] => 8
[mime] => image/png
)
*/

$target_file = time().'.png';

if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
    echo "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been uploaded.";
} else {
   echo "Sorry, there was an error uploading your file.";
}

?>