TP5使用ajax上传图片，及实现预览

TP5使用ajax上传图片，及实现预览
1、html代码

<input id="img"  style="float:left;" value=""   name="img"  type="file">
<img id="imgsrc"  height="30" src="">

2、js代码

$().ready(function (){
 //判断图片是否已经上传，如果上传则删除图片
                if( $('#imgsrc').attr('src') !== ""){
                    var data = $('#imgsrc').attr('src');

                    $.ajax({
                        type:"post",
                        dataType:"json",
                        data:{data:data},

                        url:"{:url('Cate/delimg')}",
                         }
                    });

            $('#img').change(function () {
                var formdata = new FormData();
                //因为不是整个表单数据，所以用append模拟表单信息
                //以下两种方式都可以
                //formdata.append("img", document.getElementById("img").files[0]);
                formdata.append("img", $("#img")[0].files[0]);
                $.ajax({
                    type:"post",
                    dataType:"json",
                    data:formdata,
                    /**
                     *必须false才会自动加上正确的Content-Type
                     */
                    contentType: false,
                    /**
                     * 必须false才会避开jQuery对 formdata 的默认处理
                     * XMLHttpRequest会对 formdata 进行正确的处理
                     */
                    processData: false,
                    url:"{:url('Cate/upimg')}",
                    success:function (data) {
                        var data = '/cate/uploads/' + data;
                        $('#imgsrc').attr('src',data);

                    }
                });

3、PHP代码

public function delimg(){
        if(request()->isAjax()) {
            $data = input('data');
            //传过来的路径最前面的‘/’会让路径不对，删除不成功，
            $res = unlink(substr($data,1));
            if ($res) {
               echo 1;
            }else{
                echo 2;
            }
        }else{
            $this->error('非法操作');
        }
    }
public function upimg(){
             // 获取表单上传文件
            $file = request()->file('img');

            if (empty($file)) {
                return;
            }
            // 移动到框架应用根目录/public/uploads/ 目录下
            $info = $file->move(ROOT_PATH . 'public' . DS .'cate'. DS . 'uploads');
            if ($info) {
                $data  = $info->getSaveName();
                echo json_encode($data);//不转为json格式，不能正确接收
            } else {
                // 上传失败获取错误信息
               echo  $file->getError();
            }
    }