html+jquery+php实现文件上传全过程
本例子采用html+jquery+php实现上传功能
html部分
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <form action="upload.php" method="post" enctype="multipart/form-data"> <!--上传文件:--> <input type="file" name="mypic" /> <input type="submit" value="上传" id="submit"/> </form> </body> </html>
js(jquery部分代码)
<script src="jquery-1.9.1.min.js"></script>
<script>
$("#submit").click(function(){
$.ajax({
url:"upload.php",
type:"POST",
dataType:"json",
success:function(data){
console.log(data);
}
})
})
</script>
php->upload.php部分代码
<?php //功能:完成上传图片 //php中有一个数组 $_FILES 保存当前上传文件所有信息 //1:获取上传文件名称 $picname = $_FILES["mypic"]["name"]; //2:获取上传文件大小 $picsize = $_FILES["mypic"]["size"]/1000; if($picsize>6000){ echo '{"code":-1,"msg":"图片大小不能超过2MB"}'; exit; } //3:获取上传文件临时目录 $pictmp = $_FILES["mypic"]["tmp_name"]; //echo "<br/>"; //echo $pictmp; //4:创建新图片名称 //4.1:获取原有文件名后缀 .jpg .gif .png $type = strstr($picname,"."); //4.2:创建新名称 时间戳.随机数 $fileName = time().rand(1,9999).$type; //4.3:移动文件(从上传临时文件->移动->uploads/) //a:创建变量保存临时文件名 $src = $_FILES["mypic"]["tmp_name"]; //b:创建变量保存新目录名称 $des = "uploads/".$fileName; //c:移动 //echo $des; $rs = move_uploaded_file($src,$des); if($rs){ echo '{"code":1,"msg":"图片上传成功"}'; }else{ echo '{"code":-1,"msg":"图片上传失败"}'; } //10:40--10:42 echo $picname;
需要注意的是 在php部分存储的文件为uploads,因此 需要新建个uploads的文件夹，用来存储本地上传的文件。
进行完以上步骤后，就可以进行测试了。 lz此处用的xampp本地测试。
上传成功后会显示
。此时在uploads文件下为多出来一个您刚刚上传的文件。
以上就是php+web实现文件上传的过程。实际项目中可参考此处略作更改即可实现需求哦，你学会了吗？
