对于今天 我为大家献上一个异步头像裁剪的功能 这个功能我将分为三部分进行分解. 希望大家关注哈 ^v^
jq.form插件 http://www.cnblogs.com/kissdodog/archive/2012/12/13/2817191.html
如果大家看代码不太明白可以下载视频观看哈 视频地址:
http://yunpan.cn/c3xuz6hhW9H9e http://yunpan.cn/c3xuz6hhW9H9e 访问密码 20e6
现在只有异步图片上传部分, 后面我将其它部分功能完善下面
如果大家看的明白代码可以直接看代码
视图部分:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax - 头像裁剪功能 </title>
<script src="__JS__/jquery.min.js"></script>
<script src="__JS__/jquery.form.min.js"></script>
</head>
<body>
<h1>ajax - 头像裁剪功能</h1>
<form id="form1" method="POST" enctype="multipart/form-data" action="{:U('Index/ajaxUpload')}">
<input type="file" name="Picture" />
<input type="submit" value="上传图片" />
</form>
<script>
$(function(){
$("#form1").ajaxForm(function(res){
alert('上传成功');
alert(res);
console.log(res);
return false;
});
})
</script>
</body>
</html>
控制器部分: /* 异步上传文件 No.1 */
public function ajaxUpload()
{
$upload = new \Think\Upload();// 实例化上传类
$upload->maxSize = 3145728 ;// 设置附件上传大小
$upload->exts = array('jpg', 'gif', 'png', 'jpeg');// 设置附件上传类型
$upload->rootPath = './Uploads/'; // 设置附件上传根目录
$upload->savePath = ''; // 设置附件上传(子)目录
// 上传文件
$info = $upload->upload();
print_r($info);die;
if(!$info) {// 上传错误提示错误信息
$this->error($upload->getError());
}else{// 上传成功
$this->success('上传成功!');
}
}
/* 处理图片裁剪 No.2 */
/* 处理数据存储 No.3 */
/* jq.form 原理解说 */
thinkphp_头像裁剪之异步图片上传部分代码.rar
( 1.98 MB 下载:107 次 )
最佳答案
