Ajax+php 无刷新上传图片功能

ε=(･д･｀*)ﾊｧ… 简单而粗暴的无刷新上传图片，前端效果如下面：

Paste_Image.png

亲测可以上传图片：

Paste_Image.png

（＾-＾）那就不多废话啦，直接上代码

首先在站点目录下创建以下文件夹 为了方便复制代码 样式脚本都置于index.html里面了٩(๑`н´๑)۶：

Paste_Image.png

index.html：

    
    
    



点我上传

    

      

         
上传一张图片
X
         

            
 
                 添加附件 
                  
            
 
            
 
                0% 
            
 
            
 
            

         
      
   
   





   

function.php :

 512000) { //限制上传大小 
            echo '图片大小不能超过500k'; 
            exit; 
        } 
        $type = strstr($picname, '.'); //限制上传格式 
        if ($type != ".gif" && $type != ".jpg" && $type != ".png") { 
            echo '图片格式不对！'; 
            exit; 
        } 
        $rand = rand(100, 999); 
        $pics = date("YmdHis") . $rand . $type; //命名图片名称 
        //上传路径 
        $pic_path = "./public/". $pics; 
        move_uploaded_file($_FILES['mypic']['tmp_name'], $pic_path); 
    } 
    $size = round($picsize/1024,2); //转换成kb 
    $arr = array( 
        'name'=>$picname, 
        'pic'=>$pics, 
        'size'=>$size 
    ); 
    echo json_encode($arr); //输出json数据 
}

（〜^㉨)〜 到这里就完成了哦，如果此文章对你有用，记得要加群哦，大家一起进步交流 。（PHP+JS+UI--交流/招聘 499125737）