效果截图:
上传页面
头像:
选择文件:
$(function () {
$("#upload").click(function () {
$("#imgWait").show();
var formData = new FormData();
formData.append("myfile", document.getElementById("file1").files[0]);
$.ajax({
url: "upload.php",
type: "POST",
dataType: 'json',
data: formData,
/**
*必须false才会自动加上正确的Content-Type,否则会执行error步骤
*/
contentType: false,
/**
* 必须false才会避开jQuery对 formdata 的默认处理,否则会报Uncaught TypeError: Illegal invocation
* XMLHttpRequest会对 formdata 进行正确的处理
*/
processData: false,
success: function (data) {
if(data.code == 200){
$('#avatar').attr('src',data.datas.filename);
}
$('#result').html(data.msg);
$("#imgWait").hide();
setTimeout(function(){
$('#result').html('');
}, 1200);
},
error: function () {
alert("上传失败!");
$("#imgWait").hide();
}
});
});
});
后台代码:<?php
$tmp_name = $_FILES['myfile']['tmp_name'];
$current_time = date("Y-m-d H-i-s");
if(is_uploaded_file($tmp_name)){
$filename = './'.$current_time.'.jpg';
$return = move_uploaded_file($tmp_name,$filename);
$return ? output('200','上传成功!',['filename' => $filename]) : output('400','上传失败!');
}else{
output('555','非法文件!');
}
function output($code,$msg,$datas = array()){
$outputData = array(
'code' => $code,
'msg' => $msg,
'datas' => $datas
);
exit(json_encode($outputData));
}
本文来源于网络:查看 >https://blog.csdn.net/qq_27682041/article/details/79482421