做前端的大家都知道,除了写好页面实现效果,与后台的交互也是重要的一部分,比如,我们写一个form表单,怎么传到服务器以及在页面中调用呢?
先实现一个简单的图片上传:
html代码:
//enctype="multipart/form-data"为上传编码,上传文件必须要添加这个属性<form method="post" enctype="multipart/form-data"> <input type="file" name="photo"/> <input type="submit" name="submit" id="submit" value="上传" /></form>
php代码:
<?php //1.首先要判断form表单中是否加入了文件 if(!empty($_FILES){ //判断加入的是否是图片文件 $type =$ _FILES['photo']['type']; if($type == "image/jpg" || $type == "image/png" || $type == "image/gif" || $type == "image/jpeg"){ move_uploaded_file($FILES['photo']['tmp_name],$_FILES['photo']['name']); }else{ echo "您选择的文件不合理!"; } } ?>
其中图片上传的时候,我们必须要知道几个小知识:
$_FILES 表示上传的文件 name 上传的文件原名字 temp_name 文件上传到服务器的临时文件名,上传后的文件暂时存放到该地方type 上传的文件类型 size 上传的文件大小 error 上传的而文件错误信息
可以在if里输入print_r($_FILES),查看源代码,就可以得知上面属性
aa.png
然后分享个稍微复杂点的小项目
要求:做一个菜单管理后台,可以在管理页面上传菜谱的照片,设定菜谱的菜名,以及价格。并记录到记录到menu.txt中
流程:1.分析需求 =》 2.确定变量,类型 =》3.上传处理=》 4.存储处理 =》5.输出处理
html代码:
<!--上传区域--><div id="uploadDiv"> <form action="" method="post" enctype="multipart/form-data"> <input type="file" name="upload" /> <input type="text" name="title"/> <input type="submit" name="submit" value="上传"/> </form></div><!--文件列表显示区域--><div id="listFile"> <table> <tr> <td>文件说明</td> <td>文件路径</td> <td>上传时间</td> </tr> //结合后台php代码将用户写入的数据显示在网页上 <?php foreach($fileList as $key =>$val){ // explode(a,b) 函数把字符串打散为数组。 //a:规定在哪里分割字符串。 b:要分割的字符串 $fields = explode(" ",$val); print_r($fields); if(!empty($fields[0])){ ?> <tr> <td><?=$fields[0]?></td> <td><?=$fields[1]?></td> <td><?=$fields[2]?> <?=$fields[3]?></td> </tr> <?php }}?> </table></div>
php代码:
if(!empty($_POST['submit'])){ //菜单 $menuname = $_POST['menu']; //价格 $price = $_POST['price]; //图片 $a = upload($_FILES['img']); //储存数据 saveFile($menuname,$prices,$a); } //输出数据 $last = outFile(); 上传图片文件 function upload($key){ //判断是否是图片类型 if($key['type']=="image/png" || $key['type'] == "image/jpg" || $key['type'] == "image/gif" || $key['type'] == "image/jpeg"){ //判断是否传入文件 if(copy($key['tmp_name'],$key['name'])){ return $key['name']; }else{ echo "您输入的图片格式不正确,请重新输入!"; } } } // 储存数据 function savaFile($a,$b,$c){ $line = $a." ".$b." ".$c."\n"; //注意,因为第一次打开没有还没有传入文件,防止报错,所以先在同目录下创建一个file.txt文件 $fp = fopen("file.txt",."a+"); fwrite($fp,$line); fclose($fp); //输出数据 function outFile(){ $fp = fopen("file2.txt","r"); $line = array(); while(!feof($fp){ $line[] = fgets($fp); } fclose($fp); return $line; } ?>
结果图:
bb.png
最后,送所有正在学前端的朋友一句话,路漫漫其修远兮,吾将上下而求索!
作者:孙静静
链接:https://www.jianshu.com/p/6708a2f5b283