无法将带有ajax的文件发送到php文件 [英] Can't send file with ajax to php file
问题描述
我在接收档案数据时遇到问题。
I am having a problem with receiving File Data.
这是我的HTML表格：
This is my HTML FORM:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Upload</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript" src="General.js"></script>
</head>
<body>
<form method="post" enctype="multipart/form-data" id="Form" action="upload.php">
<table width="350" border="0" cellpadding="1" cellspacing="1" class="box">
<tr>
<td width="246">
<input type="hidden" name="MAX_FILE_SIZE" value="2000000">
<input name="userfile" type="file" id="userfile">
</td>
<td width="80"><input name="submit" type="submit" class="box" id="submit" value=" Upload "></td>
</tr>
</table>
</form>
你可以看到它将我们发送到文件General.js
As you can see it sends us to the file General.js
$(document).ready(function (e){
$("#Form").on('submit',(function(e){
e.preventDefault();
var formData = new FormData(document.getElementById('userfile'));
// AJAX Code To Submit Form.
$.ajax({
type: "POST",
url: "uploader.php",
data: formData,
cache: false,
contentType: false,
processData: false,
success: function(callback){
alert(callback);
}
});
return false;
})
);
});
和php页面需要收到这个：
and the php page that need to recieve this:
$fileName = $_FILES['userfile']['name'];
$tmpName = $_FILES['userfile']['tmp_name'];
$fileSize = $_FILES['userfile']['size'];
$fileType = $_FILES['userfile']['type'];
一切正常，但问题是当我将数据发送到php文件时，它没有'接收它应该。也许我需要使用一些额外的东西？
因为文件的名称和大小都是空的。
Everything works fine, but the problem is when i send the data to the php file, it doesn't receive it as it should. Maybe i need to use some addition things? Because the name of the file and the size and everything is empty.
编辑：
$(document).ready(function(){
$("#submit").click(function(){
var formData = new FormData($('form')[0]);
// AJAX Code To Submit Form.
$.ajax({
type: "POST",
url: "uploader.php",
xhr: function() { // Custom XMLHttpRequest
var myXhr = $.ajaxSettings.xhr();
if(myXhr.upload){ // Check if upload property exists
myXhr.upload.addEventListener('progress',progressHandlingFunction, false); // For handling the progress of the upload
}
return myXhr;
},
data: formData,
cache: false,
contentType: false,
processData: false,
success: function(callback){
alert(callback);
}
});
return false;
});
});
function progressHandlingFunction(e){
if(e.lengthComputable){
$('progress').attr({value:e.loaded,max:e.total});
}
}
还尝试了这段代码，但它仍然没有将正确的信息发送到页面。我在uploader.php页面上看到一个错误，指出该文件的名称是空的，这意味着我可能没有收到它或者它根本没有发送。
Also tried this code, but still it doesn't send the right information to the page. I am getting on the uploader.php page an error that says that the name of the file is empty, what means that maybe i don't receive it good or it didn't send at all.
推荐答案
尝试使用此...
$(document).ready(function (e) {
$("#Form").on('submit',(function(e) {
e.preventDefault();
$.ajax({
url: "uploader.php", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
data: new FormData(this), // Data sent to server, a set of key/value pairs (i.e. form fields and values)
contentType: false, // The content type used when sending data to the server.
cache: false, // To unable request pages to be cached
processData:false, // To send DOMDocument or non processed data file it is set to false
success: function(data) // A function to be called if request succeeds
{
console.log(data);
}
});
}));
});
这篇关于无法将带有ajax的文件发送到php文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
