TP5.0中用uploadify实现图片上传

首先需要安装一下uploadify，安装位置如图：


首先页面中需要有个容器：

<input id="file_upload"  type="file" multiple >
<img style="display: none" id="upload_org_code_img" src="" width="150" height="150">

input用来上传图片
img用来显示上传成功后的缩略图

定义一下路由：

<script>
 var SCOPE = {
    'uploadify_swf' : '__STATIC__/admin/uploadify/uploadify.swf',
    'image_upload' : '{:url('api/image/upload')}',
 };
</script>

JS代码如下：

$("#file_upload").uploadify({
        'swf'                :    SCOPE.uploadify_swf,
        'uploader'            :    SCOPE.image_upload,
        'buttonText'        :    '图片上传',
        'fileTypeDesc'        :    'Image files',
        'fileObjName'        :    'file',
        'fileTypeExts'        :    '*.jpeg; *.jpg; *.png;', //允许上传的图片类型
// 成功后执行的方法:    在页面img标签中显示缩略图，
        'onUploadSuccess'    :    function(file,data,response){
            var obj=JSON.parse(data);
            $("#upload_org_code_img").attr("src",obj.data);
            $("#file_upload_image").attr("value",obj.data);
            $("#upload_org_code_img").show();
        }
    });


PHP代码如下：

<?php
namespace app\api\controller;
use think\Controller;
use think\Request;
use think\File;
class Image extends Controller{
    public function upload(){
//        TP5自带类Request 自带文件上传方法    file()
        $file=Request::instance()->file('file');
//        move('upload') 移动到目录名为“upload” 如果没有此文件就创建
        $info=$file->move('upload');
//        判断获取Pathname是否存在，用方法getPathname()，存在即可认为上传成功
        if($info && $info->getPathname()) {
            return show(1,'success','/'.$info->getPathname());
        }
        return show(0,'upload error');
    }
}

转载于:https://www.cnblogs.com/xwenbin/p/10613007.html