首先,将下载的Uploadify压缩包解压放到公共文件夹内。实现代码如下:

前台html部分:

<script src="/uploadify/jquery.min.js" data-ke-src="/Public/uploadify/jquery.min.js" type="text/javascript">
<script src="/uploadify/jquery.uploadify.min.js" data-ke-src="/Public/uploadify/jquery.uploadify.min.js" type="text/javascript">
<link rel="stylesheet" type="text/css" href="/uploadify/uploadify.css" data-ke-src="/Public/uploadify/uploadify.css">
<script type="text/javascript">
var img_id_upload=new Array();//初始化数组,存储已经上传的图片名
var i=;//初始化数组下标
$(function() {
$('#file_upload').uploadify({
'auto' : false,//关闭自动上传
'removeTimeout' : ,//文件队列上传完成1秒后删除
'swf' : '/Public/uploadify/uploadify.swf',
'uploader' : '/_URL_/Article/uploadify',
'method' : 'post', //方法,服务端可以用$_POST数组获取数据
'buttonText' : '选择图片',//设置按钮文本
'multi' : true,//允许同时上传多张图片
'uploadLimit' : ,//一次最多只允许上传10张图片
'fileTypeDesc' : 'Image Files',//只允许上传图像
'fileTypeExts' : '*.gif; *.jpg; *.png',//限制允许上传的图片后缀
'fileSizeLimit' : '2000KB',//限制上传的图片大小
'onUploadSuccess' : function(file, data, response) { //每次成功上传后执行的回调函数,从服务端返回数据到前端
$('#image').append('<div style="float:left;margin:2px 0 0 2px"><img width="100px" height="100px" src="/uploads/'+data+'" data-ke-src="/uploads/'+data+'" height=80 width=80 />');
img_id_upload[i]=data;
i++;
}
});
});
</script>
<input type="file" name="file_upload" id="file_upload" />
<p><a href="javascript:$('#file_upload').uploadify('upload','');" data-ke-src="javascript:$('#file_upload').uploadify('upload','');">上传</a>
</p>
<br />
<div id="image" class="image"><br />

action执行代码部分:

public function uploadify()
{
$ph=M('Upload');
import('ORG.Net.UploadFile');
$upload = new UploadFile();// 实例化上传类
$upload->maxSize = ;// 设置附件上传大小
$upload->saveRule =rand(,);
$upload->allowExts = array('jpg', 'gif', 'png', 'jpeg','flv','avi','mov');// 设置附件上传类型
$upload->savePath = './Uploads/';// 设置附件上传目录
if(!$upload->upload())
{// 上传错误提示错误信息
$this->error($upload->getErrorMsg());
}else{// 上传成功 获取上传文件信息
$info = $upload->getUploadFileInfo();
}
for($i=;$i<count($info);$i++)
{
$data['name']=$info[$i]['savename'];
$data['size']=$info[$i]['size'];
$data['type']=$info[$i]['extension'];
echo $info[$i]['savename'];
$rs=$ph->add($data);
}
/*if($rs)
{
$this->success("成功");
}else
{
$this->error("失败");
}*/
}

使用ThinkPHP+Uploadify实现图片上传功能的更多相关文章

  1. thinkphp达到UploadFile.class.php图片上传功能

    片上传在站点里是非经常常使用的功能.ThinkPHP里也有自带的图片上传类(UploadFile.class.php) 和图片模型类(Image.class.php).方便于我们去实现图片上传功能,以 ...

  2. Spring+SpringMVC+MyBatis+easyUI整合优化篇(七)图片上传功能

    日常啰嗦 前一篇文章<Spring+SpringMVC+MyBatis+easyUI整合优化篇(六)easyUI与富文本编辑器UEditor整合>讲了富文本编辑器UEditor的整合与使用 ...

  3. ThinkPHP示例:图片上传

    ThinkPHP示例之图片上传,包括图片上传.数据库保存.缩略图生成以及图片水印功能演示.首先需要下载框架核心,然后把示例解压到Web根目录下面,并修改入口文件中的框架入口文件的位置.导入示例目录下面 ...

  4. PHP语言学习之php做图片上传功能

    本文主要向大家介绍了PHP语言学习之php做图片上传功能,通过具体的内容向大家展示,希望对大家学习php语言有所帮助. 今天来做一个图片上传功能的插件,首先做一个html文件:text.php < ...

  5. [Ting's笔记Day8]活用套件carrierwave gem:(3)Deploy图片上传功能到Heroku网站

    前情提要: 身为Ruby新手村民,创造稳定且持续的学习步调很重要,我用的方法就是一周在IT邦写三篇笔记,希望藉由把笔记和遇到的bug记录下来的过程,能帮助到未来想用Ruby on Rails架站的新手 ...

  6. H5 利用vue实现图片上传功能。

    H5的上传图片如何实现呢? 以下是我用vue实现的图片上传功能,仅供参考. <!DOCTYPE html> <html> <head> <meta chars ...

  7. 给DEDECMS广告管理中增加图片上传功能

    dedecms的广告管理功能稍微有点次,本文就是在dedecms广告管理原有的基础上增加广告图片上传功能. 安装方法,对应自己的dedecms版本下载对应的编码然后解压把里面的文件放在后台目录覆盖即可 ...

  8. vue 图片上传功能

    这次做了vue页面的图片上传功能,不带裁剪功能的! 首先是html代码,在input框上添加change事件,如下:   <ul class="clearfix">   ...

  9. 前端丨如何使用 tcb-js-sdk 实现图片上传功能

    前言 tcb-js-sdk 让开发者可以在网页端使用 JavaScript 代码服务访问云开发的服务,以轻松构建自己的公众号页面或者独立的网站等 Web 服务.本文将以实现图片上传功能为例,介绍 tc ...

随机推荐

  1. IntelliJ idea 14 集成 tomcat 7

    来到公司第一个任务就是先把web项目跑起来,所以如何在IntelliJ idea14中把Tomcat集成起来也是个不小的问题. 首先确认你的idea 14 不是 Communit Edition 社区 ...

  2. HDU 4738 双连通模版题

    九野的博客,转载请注明出处:http://blog.csdn.net/acmmmm/article/details/11711577 题意:给定n个点,m条无向边 下面m行表示u , v ,边权值 求 ...

  3. C++0x简讯

    关于C++0x核心进展的一组简讯 刘未鹏 /文 C++的罗浮宫(http://blog.csdn.net/pongba) Concepts无疑是C++0x的杀手级特性之中的一个(也许称它“杀手级”另一 ...

  4. SD-关于定价日期的设置

    最近看了一篇关于定价日期的文章,我觉得写得很不错,特将自己的理解摘抄如下: 关于SD的定价日期在SAP系统中有三个配置与其相关,以及手工输入定价日期,具体如下: 1.订单类型的“定价日期建议“ 这个字 ...

  5. Maven和Eclipse联合开发(转)

    最近公司突然把以前的架构推到从来,这个还真需要勇气,不过也是的,基础不好,再好的房子也站不稳.公司采用Maven作为项目管理,WebService项目框架采用SDHI.(Spring+Dubbo+He ...

  6. perl 面向对象 use base

    1.XXX.pm 文件里面的第一行要是:package XXX: 2.要有构造函数 sub new,实现如下: sub new { my $class = shift; # Get the reque ...

  7. Android解析Excel文档完整示例

    MainActivity如下: package cc.testexcel; import java.io.File; import jxl.Cell; import jxl.CellType; imp ...

  8. nodejs安装不了和npm安装不了的解决方法

    http://caibaojian.com/nodejs-roll-back.html

  9. [置顶] Guava学习之Lists

    Lists类主要提供了对List类的子类构造以及操作的静态方法.在Lists类中支持构造ArrayList.LinkedList以及newCopyOnWriteArrayList对象的方法.其中提供了 ...

  10. mysql的1067错误 - 2

    上一篇博文<mysql的1067错误>中由于日志配置问题产生1067错误. 由于要升级MySQL到V5.6,所以拷贝my.ini和数据文件到新的系统上. 在启动服务时,又出现1067错误! ...