需要用到:ajaxfileupload
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://3.zy62.com/ajaxfileupload.js"></script>
<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<h1 class="page-header">ajax上传</h1>
<form id="upload" action="https://api.weixin.qq.com/cgi-bin/media/upload?access_token=mdJiyvzApDgpaBuin0V4JbhdmsGcaPDJvsrOTdL0l8185JvqvW2WIS0EIKCP9ntFXf82fWaJfEWiRdivissAKKcR6pJlM6V66RtjN29rVjA&type=image" method="post" enctype="multipart/form-data">
<div class="form-group">
<label for="exampleInputFile">File input</label>
<input type="file" name="media" id="file">
<p class="help-block">Example block-level help text here.</p>
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
<a class="btn btn-default" href="#" id="test" role="button">Link</a>
<p>
<img id="img" src=""/>
</p>
<script>
$(document).ready(function(){
$(‘#test‘).click(function(){
$.ajaxFileUpload({
url:‘{:U("Index/upload")}‘,
secureuri: false,
fileElementId:‘file‘,
dataType: ‘text‘,//返回数据类型
success: function (data, status){
//alert(data);
$("#img").attr("src","http://127.0.0.1/6/0604/Uploads/2015-06-06/"+data);
},
error: function (data, status, e)//服务器响应失败处理函数
{
alert(e);
}
});
//$(‘#upload‘).submit();
});
});
</script>
</div>
</body>
</html>
PHP接收文件：
public function upload(){
$upload = new \Think\Upload();// 实例化上传类
$upload->maxSize = 3145728 ;// 设置附件上传大小
$upload->exts = array(‘jpg‘, ‘gif‘, ‘png‘, ‘jpeg‘);// 设置附件上传类型
$upload->rootPath = ‘./Uploads/‘; // 设置附件上传根目录
$upload->savePath = ‘‘; // 设置附件上传（子）目录
// 上传文件
$info = $upload->upload();
if(!$info) {// 上传错误提示错误信息
//$this->error($upload->getError());
echo 456;
}else{// 上传成功
echo $info[‘media‘][‘savename‘];
//print_r($info);
//$this->success(‘上传成功！‘);
}
}
效果预览:
原文：http://my.oschina.net/rain21/blog/425565