Ajax POST文件上传

Question

I have what i thought was a very simple task, but I can't seem to get it working correctly. I'm hoping someone with a better understanding of Ajax can help me figure out where i'm going wrong.

I have a simple input box on my page...

<form onchange="imgUpload();" >
    File: <input id='img' name="myfile" type="file" />
</form>

Here is the function it calls...

function imgUpload(){


    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {
            // document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
            alert(xmlhttp.responseText);
        }
    }

    var imgFile = document.getElementById("img");
    var formData = new FormData();                  // Create a FormData instance
    formData.append("upload", imgFile.files[0]);        //Add the file

    xmlhttp.open("POST","img_upload.php",true);
    xmlhttp.setRequestHeader("Content-type","multipart/form-data");
    xmlhttp.send(formData);     
}

My PHP page to process the POST currently does nothing more then echo back the array of the post...

<?php
    print_r($_POST);
    exit;
?>

My problem is when I get the result of the POST back, it's an empty array. Apparently I'm not actually sending the file to my processing page. Any insight on where i've gone wrong would be greatly appreciated.

I have found several other posts on this forum and others that talk about the same issue or topic, but they don't seem to get me where I need to be.

Thanks in advance!