thinkphp3.2+jquery_fileupload图片上传

浏览:1650 发布日期:2018/05/24 分类:功能实现 关键字: 图片上传 fileupload
thinkphp3.2+jquery_fileupload图片上传
QQ群:282882201


阿里云搞活动,想要抓紧买:https://promotion.aliyun.com/ntms/act/qwbk.html?userCode=4hy76kwx

php代码public function up(){
        $path_url = 'images/';
        $upload = new \Think\Upload();//UploadFile();// 实例化上传类
        
        $upload->maxSize   =     3145728 ;// 设置附件上传大小
        $upload->exts      =     array('jpg', 'gif', 'png', 'jpeg');// 设置附件上传类型
        $upload->rootPath  =     './Uploads/'; // 设置附件上传根目录
        $upload->savePath  =     $path_url; // 设置附件上传(子)目录
        
        $info   =   $upload->upload();
        if(!$info) {
            // 上传错误提示错误信息
            $this->error($upload->getError());
        }else{
            $savename = $info[0]['savename'];
            $up_url = $upload->rootPath.$info[0]['savepath'].$info[0]['savename'];
            $data = array();
            $data['status'] = 1;
            $data['info'] = '';
            $data['pic_url'] = $up_url;
            $this->ajaxReturn($data);
        }
    }
模板代码<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="__PUBLIC__/upload/css/bootstrap.min.css">
<link rel="stylesheet" href="__PUBLIC__/upload/css/jquery.fileupload.css">
</head>
<body>
<div class="container">
    <div class="input-group">
        <input type="text" class="form-control" readonly name="pic" id="pic"/>
        <span class="input-group-btn">
            <div class="btn btn-success  fileinput-button">
                上传
                <input id="fileupload" type="file" name="files[]" multiple>
            </div>
        </span>
    </div>
    <!-- The container for the uploaded files -->
    <div width="100%" id="files" class="files"></div>
</div>
<script src="__PUBLIC__/upload/js/jquery-1.8.0.min.js"></script>
<!-- The jQuery UI widget factory, can be omitted if jQuery UI is already included -->
<script src="__PUBLIC__/upload/js/vendor/jquery.ui.widget.js"></script>
<!-- The Iframe Transport is required for browsers without support for XHR file uploads -->
<script src="__PUBLIC__/upload/js/jquery.iframe-transport.js"></script>
<!-- The basic File Upload plugin -->
<script src="__PUBLIC__/upload/js/jquery.fileupload.js"></script>
<!-- Bootstrap JS is not required, but included for the responsive demo navigation -->
<script src="__PUBLIC__/upload/js/bootstrap.min.js"></script>
<script>
$(function () {
    var url =  "{:U('Index/up')}";
    $('#fileupload').fileupload({
        url: url,
        dataType: 'json',
        done: function (e, data) {
            if(data.result.status == 1){
                $("#pic").val(data.result.pic_url);
                $("#files").html("<img src=__ROOT__/"+data.result.pic_url+" width='600'/>");
            }else{
                $("#files").html(data.result.info);
            }
        }
    });
});
</script>
</body>
</html>
可加群:282882201,在群文件中下载源码。

QQ群:282882201


阿里云搞活动,想要抓紧买:https://promotion.aliyun.com/ntms/act/qwbk.html?userCode=4hy76kwx
评论( 相关
后面还有条评论,点击查看>>