我有一个非常简单的 HTML 页面,其中包含如下图片上传表单:
<form id="file_data">
<input type='file' id='image_uploaded' accept='image'/>
<input type='submit' id="upload_image"/>
</form>
我的Javascript:
$(document).ready(function() {
$("form[id='file_data']").submit(function() {
var form_data = new FormData(this);
$.ajax({
url: "upload.php",
type: "POST",
data: form_data,
processData: false,
success: function(data) {
alert(data);
}
});
});
});
upload.php
正在创建一个用于存储图像的目录(如果该目录尚不存在)。然后应该将图像存储在目录中:
<?php
define("IMAGE_DIRECTORY", "images");
//If the directory for images does not exist, create it
if(!is_dir(IMAGE_DIRECTORY)) {
mkdir(IMAGE_DIRECTORY, 0777, true);
}
move_uploaded_file($_FILES["tmp_name"], IMAGE_DIRECTORY . "\\" .basename($_FILES["file"]["name"]));
?>
虽然 PHP 脚本会创建目录,但如果目录不存在,则不会将任何图像保存到目录中。我假设我没有从 PHP 正确访问图像,但我看过的教程没有解释太多关于在 Ajax 调用中发送图像到 PHP 时实际发生的细节。
最佳答案
你在代码中遗漏的问题:
HTML:enctype="multipart/form-data"
在 form
上传文件,还有<input type="file"
缺少 name="file"
PHP:move_uploaded_file
不正确你错过了['file']
对于 tmp_name $_FILES['file']["tmp_name"]
Ajax:dataType:"html"
丢失,以便您的 ajax 从服务器获取作为字符串的响应
像这样更新您的 Html、Php 和 Ajax 代码:
HTML 代码:
<form id="file_data" enctype="multipart/form-data" method="post">
<input type='file' name='file' id='image_uploaded' accept='image'/>
<input type='submit' id="upload_image"/>
</form>
PHP代码:
<?php
define("IMAGE_DIRECTORY", "images");
//If the directory for images does not exist, create it
if(!is_dir(IMAGE_DIRECTORY)) {
mkdir(IMAGE_DIRECTORY, 0777, true);
}
move_uploaded_file($_FILES['file']["tmp_name"], IMAGE_DIRECTORY . "\\" .basename($_FILES["file"]["name"]));
?>
Ajax 代码:
$.ajax({
url: "upload.php",
data : form_data,
type : "POST",
async: false,
cache: false,
contentType: false,
processData: false,
dateType : "html",
success: function(data) {
alert(data);
}
});
关于javascript - 图像未使用 PHP 脚本保存,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43267241/