云迈博客

您现在的位置是:首页 > 灌水专栏 > 正文

灌水专栏

Ajax异步多图上传

JieJie2020-12-28灌水专栏305
$("#upload-input").change(function(){vardata=newFormData();//每张图片添加到FormData

$(“#upload-input”).change(function(){
var data = new FormData();

    //每张图片添加到FormData
    $.each($("#upload-input")[0].files,function(i,file){
        data.append("file"+i,file);
    });

    //发送数据
    $.ajax({
        url:'{:url("Upload/uploads")}',
        type:'post',
        data:data,
        dataType:'json',
        cache: false,
        contentType: false,
        processData: false,
        // contentType: false 和processData: false,这两个参数是为了设置ajax对file文件对象进行序列化
        success:function(data){
            $("#datas").attr("value",data.images);
        },
        error:function(){
            alert('上传出错');
        }
    });

});


//后台
//多图片上传
public function uploads(){
    $index = 0;

    foreach($_FILES as $file){
        $picName = 'file' . $index;//对应index.html FomData中的文件命名
        $fileName = $_FILES[$picName]['name'];

        $names = request()->file($picName);
        $info = $names->move(ROOT_PATH.'uploads/image/');
        if($info){
                $imgpath="/uploads/image/".$info->getSaveName();//获取图片名字
                $response['success'] = true;
                $response['images'][] = $imgpath;
            }else{
                $response['success'] = false;
            }
        $index++;
    }
    if($index==count($_FILES)){
        $datas = [];
        $datas["success"] = $response['success'];
        $str = "";
        foreach($response["images"] as $v){
            $str.= $v."***";
        }
        $datas["images"] = $str;
        return json($datas);
    }

}

发表评论

评论列表

  • 这篇文章还没有收到评论,赶紧来抢沙发吧~