<script src="../js/jquery-1.12.4.min.js"></script>
<script>
$(function(){
//使用ajax实现图片预览
$(‘input‘).change(function(){
var sendData =new FormData();
//当发送数据哪里没有需要的name值 可以通过formData.append出来
sendData.append(‘icon‘,this.files[0]);
$.ajax({
url:‘./upload.php‘,
data:sendData,
type:‘post‘,
// 一定要加这两句,不然会报错
contentType: false,
processData: false,
success:function(backData){
// console.log(backData);
//把返回的数据(是一个图片路径)设置给img的src属性
$(‘img‘).attr(‘src‘,backData);
}
})
})
})
</script>
预览结构跟上面是一样的
PHP代码:
<?php
header(‘content-type:text/html;charset=utf-8‘);
//接收什么,就返回什么数据
//保存文件格式
$fileName =iconv(‘utf-8‘,‘gbk‘,$_FILES[‘icon‘][‘name‘]);
//更改文件路径
move_uploaded_file($_FILES[‘icon‘][‘tmp_name‘],‘./icon/‘.$fileName);
//返回数据
echo ‘./icon/‘.$_FILES[‘icon‘][‘name‘];
?>
新建一个保存图片的文件,icon