PC后台多文件上传

kn
2018-11-23 10:16:59
常用代码片段

1.html

<div class="form-group">
    <label class="col-sm-1 control-label no-padding-right" for="form-field-4">
        详情页展示图 </label>
    <div class="col-sm-9">
    <div style="float: left" id="tushow">

        <volist name='pimg' id='v'>
            <li style="float: left;list-style: none;margin-right: 5px">
            <img src="{$v}" alt="" width="100" height="100" /><input type="hidden" name="uploadfile[]" value="{$v}" /><p style="text-align: center"><a style="cursor:pointer" onclick="javascript:ondel(this)">删除</a></p></li>
        </volist>

    </div>
        <div class="col-xs-10 col-sm-5" style="clear: none">
            <input id="fileupload" type="file" name="files[]" multiple>
        </div>
        <span class="help-inline col-xs-12 col-sm-7" style="clear: none">
                    <span class="middle">建议像素：1364*600</span>
                </span>
    </div>

</div>

2.js

upload.rar

<script src="/Public/upload/js/jquery.ui.widget.js"></script>
<script src="/Public/upload/js/jquery.iframe-transport.js"></script>
<script src="/Public/upload/js/jquery.fileupload.js"></script>
<script type="text/javascript">
$('#fileupload').fileupload({
        url: '/uploads.html',
        dataType: "json",
        multipart:true,
        done:function(e,data){
            if(data.result.sta) {
                // 上传成功：
                $("#tushow").append('<li style="float: left;list-style: none"><img src="'+data.result.previewSrc+'" alt="" width="100" height="100" /><input type="hidden" name="uploadfile[]" value="'+data.result.previewSrc+'" /><p style="text-align: center"><a style="cursor:pointer" onclick="javascript:ondel(this)">删除</a></p></li>');
                // $(".preview").append("<div>"+data.result.msg+"</div>");
            } else {
                // 上传失败：
                // $(".upstatus").append("<div style='color:red;'>"+data.result.msg+"</div>");
                alert('上传失败，请重试');
            }

        },
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);
            $(".progress .bar").css("width", progress + "%");
            $(".proportion").html("上传总进度："+progress+"%");
        }
    });

function ondel(t){
    // alert(t);
    $(t).parent().parent().remove();
}
</script>

3.php

public function uploads(){
        // var_dump($_FILES['files']);exit;
        $ret=uploadmore($_FILES['files']);
        echo $ret;
    }

function uploadmore($files){
    // $fileArr = $_FILES['files'];
    $fileArr = $files;
    define(ROOT,dirname(dirname(dirname(dirname(__FILE__)))));
    // var_dump(ROOT);exit;
    //设置预览目录
    $times=date('Ymd');
    $previewPath = "/Public/attached/".$times."/";
    creatDir($previewPath);
    //ajax返回数组
    $data = array('sta'=>TRUE,'msg'=>'图片上传成功！');
    //检查是否为图片
    $ext = getExt($fileArr['name'][0]);
    $arrExt = array('jpg','jpeg','gif','png');
    if(!in_array($ext,$arrExt)) {
        $data['sta'] = FALSE;
        $data['msg'] = 'Error:文件《'.$fileArr['name'][0].'》不是图片或采用了不合适的扩展名！';
    } else {
        //文件上传到预览目录
        if($fileArr['error'][0] == 0) {
            $previewName = 'pre_'.md5(mt_rand(1000,9999)).time().'.'.$ext;
            $previewSrc = $previewPath.$previewName;
            // $fileName = $fileArr['name'][0];
            $sss=move_uploaded_file($fileArr['tmp_name'][0],ROOT.$previewSrc);
            // var_dump($fileArr['tmp_name'][0]);var_dump($previewSrc);exit;
            if(!$sss) {
                $data['sta'] = FALSE;
                $data['msg'] = $fileArr['name'][0].'图片上传失败！';
            } else {
                $data['msg'] = $fileArr['name'][0].'图片上传成功！';
                $data['previewSrc'] = $previewSrc;
            }
        }
    }
    return json_encode($data);
}

//获取文件扩展名
function getExt($filename) {
    $ext = pathinfo($filename, PATHINFO_EXTENSION);
    return $ext;
}
//创建目录并赋权限
function creatDir($path) {
    $arr = explode('/',$path);
    $dirAll = '';
    $result = FALSE;
    if(count($arr) > 0) {
        foreach($arr as $key=>$value) {
            $tmp = trim($value);
            if($tmp != '') {
                $dirAll .= $tmp.'/';
                if(!file_exists($dirAll)) {
                    mkdir($dirAll,0777,true);
                }
            }
        }
    }
}

本文为看恩吧原创文章,转载无需和我联系,但请注明来自knsay.com

打赏