前端上传文件 后端PHP获取文件 

<body>//方法一
  <form action="03-post-file.php" method="post" enctype="multipart/form-data">
    <!-- enctype="multipart/form-data" 必须给form表单指定该属性，否则上传不了文件 -->

    <input type="file" name="upFile"><br> 
    <!-- input type="file" 上传文件 -->
    <input type="submit" value="上传">
  </form>
</body>
<?php
//echo "post page";
//print_r($_FILES);

// 获取上传文件对应的字典（对象
$fileInfo = $_FILES["upFile"];

// print_r($fileInfo);
// echo "<br>";

// 获取上传文件的名称
$fileName = $fileInfo["name"];

// 获取上传文件保存的临时路径
$filePath = $fileInfo["tmp_name"];

// echo $fileName;
// echo "<br>";
// echo $filePath;

//移动文件
move_uploaded_file($filePath, "./source/".$fileName);
// 注意这里的路径写法， 第二个参数的字符串和变量拼接 用. 而不是JS里的 +
// "./source/"  不要忘记末尾的斜杠
?>
<div class="tab-content" > //方法二
     <form action="{:U('User/donefb')}"  method="post" enctype="multipart/form-data" name="myform" id="myform" style="">
                   //上传图片并展示
        <div class="fk_ban fk_ban1" style="width: 25%;margin: 10px 0;line-height:auto">上传凭证：</div>
               <a class="fxtwo" href="javascript:sfzzmSc();">
                   <div id="sfzzmImg" class="grids-icon">

                      <img src="" style="width:60px; margin-left: 100px; display:none" >
                   </div>

             <input  style="margin-left: 70px;" id="sfzzm" type="file" name='img' onchange="showpic(this,'sfzzmImg');" accept="image/*"  />
                                                           
            </a>
  <div onclick="subthis()" style="width: 80px;float: left;margin-left: 60px;line-height: 30px;text-align: center;background: #0dae8d;color: #fff;margin-top: 20px;cursor: pointer">
       提交
  </div>
 </form>
 </div>

 <script>
 //提交表单
function subthis(){
    console.log(1111);
    $("#myform").submit();
}

function sfzzmSc(){
    $("#sfzzm").click();

}
//预览图片
function showpic(obj,id){
    console.log(obj);
    console.log(obj.files);
    for(var i = 0, file; file = obj.files[i]; i++){
        if(i>0){
            break;
        }
        var reader = new FileReader();
        reader.onload = function(e){
        //    console.log(e);
            var htmlimg='<img style="width:60px; margin-left: 100px;" id="'+e.timeStamp+'" class="min"  src="'+e.target.result+'" />';
            $("#"+id).html(htmlimg);
        }

        reader.readAsDataURL(file);

    }
}
 
</script>

 

posted @ 2020-12-20 21:34  大熊童鞋  阅读(954)  评论(0)  编辑  收藏  举报