1.首先需要安装一下uploadify,安装位置如图:
2. 在页面中引入css、js代码
<link rel="stylesheet" type="text/css" href="__STATIC__/admin/uploadify/uploadify.css" />
{load href="__STATIC__/admin/uploadify/jquery.uploadify.min.js" /}
{load href="__STATIC__/admin/js/image.js" /}
image.js:
$(function(){
$("#file_upload").uploadify({
swf : swf,
uploader : image_upload_url,
buttonText : '图片上传',
fileTypeDesc: 'Image files',
fileObjName: 'file',
fileTypeExts: '*.gif;*.jpg;*.png',
onUploadSuccess: function(file, data, response){
if(response){
var obj = JSON.parse(data);
$('#upload_org_code_img').attr("src", obj.data);
$('#file_upload_image').attr("value", obj.data);
$('#upload_org_code_img').show();
}
}
});
});
3.页面中需要有个容器
<input id="file_upload" type="file" multiple="true" >
<img style="display: none" id="upload_org_code_img" src="" width="150" height="150">
<input id="file_upload_image" name="image" type="hidden" multiple="true" value="">
input用来上传图片
img用来显示上传成功后的缩略图
4.定义inage.js中的swf image_upload_url
<script>
swf = '__STATIC__/admin/uploadify/uploadify.swf';
image_upload_url = "{:url('image/upload')}";
</script>
5.控制器
image控制器下的upload方法
public function upload(){
$file = Request::instance()->file('file');
//把图片上传到指定的文件夹中
$info = $file->move('upload');
if($info && $info->getPathname()){
$data = [
'status' => 1,
'message' => 'OK',
'data' => '/'.$info->getPathname(),
];
echo json_encode($data);exit;
}
echo json_encode(['status' => 0, 'message' => '上传失败']);
}
提示:使用uploadify时需要浏览器开启flash