ajax 文件上传

yqy1234hf 2021-03-14 12:00:32

前端代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<script>
function myFunction() {
// alert("进入函数");
//document.getElementById("shuchu").innerHTML="Hello World";
var form = document.getElementById('form1');
var formdata = new FormData(form);

var xmlhttp;
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xmlhttp=new XMLHttpRequest();
}
else
{
// IE6, IE5 浏览器执行代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
// document.getElementById("shuchu").innerHTML=xmlhttp.responseText;
alert(xmlhttp.responseText);
}
}
xmlhttp.open("POST","test_ajax_formdata.php",true);
xmlhttp.send(formdata);
}
</script>

</head>
<body>

<form name="form1" id="form1" onsubmit="myFunction()">
A: <input type="text" name="firstname"><br>
B: <input type="text" name="lastname"><br>
<input type="file" name="file">
<input type="submit" value="提交">
</form>

<div id="shuchu">ddddddddddddddddd</div>

</body>
</html>

后端代码：
<?php
echo "A的值:".$_POST["firstname"]."<br>";
echo "B的值:".$_POST["lastname"]."<br>";
echo "上传文件名: " . $_FILES["file"]["name"] . "<br>";
echo "文件类型: " . $_FILES["file"]["type"] . "<br>";
echo "文件大小: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
echo "文件临时存储的位置: " . $_FILES["file"]["tmp_name"];
?>

思路：把整个表单数据上传后php输出表单中各项的值
问题一混合表单可以一起用formdata上传吗？因为该表单项中有一般数据和文件数据混合着
问题二后端的服务器是怎么解析表单的？数据发送到php服务后的处理过程与解析算法就比如数据发送到服务器上服务器是怎么区分一般数据与文件数据的。

希望有前辈能指点下先谢谢！推荐下看什么书籍能解决我的问题。只要是能帮助到解决问题的信息都可以。万分感谢！

...全文