php 文件上传

<div class="upload">
							<div id="form_group_file" >
								<p>委托资料</p>
								<input type="text" id="file" name="file">
								<div  id="filePicker_file"></div>
							</div>
							</div>

							<p id="upding" style="display: none; padding:10px; text-align: right;">上传中... (<span>0%</span>)</p>

js

<!-- webuploader -->
<link rel="stylesheet" href="/static/plugins/webuploader-0.1.5/webuploader.css">
<script src="/static/plugins/webuploader-0.1.5/webuploader.min.js"></script>
<script type="text/javascript">
    /**
     * 封装上传组件
     * @param list
     * @param filePicker_image
     * @param image_preview
     * @param image
     * @param more            是否图集
     * @param upload_allowext 格式限制
     * @param size            大小限制
     * @param type            上传类型[file/img]
     */
  
		
		var uploader = WebUploader.create({
		
		    // 选完文件后，是否自动上传。
		    auto: true,
		
		    // swf文件路径
		    swf: '/static/plugins/webuploader-0.1.5/js/Uploader.swf',
		
		    // 文件接收服务端。
		    server: '/upfile.php',
		
		    // 选择文件的按钮。可选。
		    // 内部根据当前运行是创建，可能是input元素，也可能是flash.
		    pick: '#filePicker_file',
		
		    // 只允许选择图片文件。
		    accept: {
		        title: 'Images',
		        extensions: 'gif,jpg,jpeg,bmp,png,ppt,rar,zip,doc,docs',
		        // mimeTypes: 'image/*'
		    }
		});
		
		// 当有文件添加进来的时候
		uploader.on( 'fileQueued', function( file ) {
		     $('#upding').show();
		});
		
		// 文件上传过程中创建进度条实时显示。
		uploader.on( 'uploadProgress', function( file, percentage ) {
		  
		   $('#upding span').text(percentage * 100 + '%' )
		
		});


         uploader.on( 'uploadSuccess', function( file , res) {
			 $('#upding').text('上传成功')
			 console.log(res.img)
			 $('#file').val(res.img)
             
         });
         
         // 文件上传失败，显示上传出错。
         uploader.on( 'uploadError', function( file ) {
			 console.log(file)
         });
         
         // 完成上传完了，成功或者失败，先删除进度条。
         uploader.on( 'uploadComplete', function( file ) {
              $('#upding').hide();
         });
    
</script>

php

upfile.php 放置根目录

<?php
if (!$_FILES['file']['error']){
    if ($_FILES['file']['type'] == 'image/jpeg' || $_FILES['file']['type'] == 'image/png' || $_FILES['file']['type'] == 'application/x-rar' || $_FILES['file']['type'] == 'application/x-zip' || $_FILES['file']['type'] == 'application/msword'){
        if ($_FILES['file']['size']<200000){
//文件传到文件夹中，可以拼接时间戳，用户名等防止文件名重复
            $file_name = "uploads/file/".mt_rand(100,9999).$_FILES['file']['name'];
            if (!file_exists($file_name)){
                move_uploaded_file($_FILES['file']['tmp_name'],$file_name);
//                $filename=iconv("UTF-8","",$file_name);
     $img = $file_name;
     exit(json_encode(array('code'=>200,'msg'=>'上传成功', 'img'=>$img,'type'=>$_FILES['file']['type'])));
            }else{
                exit(json_encode(array('code'=>0,'msg'=>'文件已经存在')));
            }
        }else{
            exit(json_encode(array('code'=>0,'msg'=>'文件太大了，不能超过2M')));
        }
    }else{
  exit(json_encode(array('code'=>0,'msg'=>'文件格式错误,只能上传jpg和png格式图片','type'=>$_FILES['file']['type'])));
  var_dump($_FILES);
    }
}else{
 exit(json_encode(array('code'=>0,'msg'=>'上传失败')));
}