Ajaxupload插件超级简单使用(php的ci框架)
Ajaxupload简单使用
友情提示:1、蓝色文字为必修改内容。2、#字符后面是解释该代码段的主要内容
备注: 该实例是用php的ci框架直接接收图片并保存
1、 引用AjaxUpload.js文件
#public/js/ajaxupload.js ajaxupload插件的文件位置
<script tyep="text/javascript" src="public/js/ajaxupload.js"></script>
2、 创建页面并编写HTML
#upload 该id是必需的,但可以自定义
<button id="upload">上传图片</button>
3、 编写JS脚本
#upload 与第二步创建的button的id要相对应,必需对应
#<?php echo site_url("base/upload_pic") ?> 这里是服务器的url地址,不过这里是ci框架的。
#userfile 像是<input type="file" name="userfile" />这个input标签的name的值
#desc 该数据可以随图片一起上传到服务器,用post接收
#response 上传图片后,服务器返回的数据
$(document).ready(function(){
var button = $('#upload'), interval;
var fileType = "all",fileNum = "one";
new AjaxUpload(button,{
action: '<?php echo site_url("base/upload_pic") ?>',
name: 'userfile',
onSubmit : function(file, ext){
var desc = $("#pic_des").val();
this.setData({"des":desc});
button.text('文件上传中');
if(fileNum == 'one')
this.disable();
interval = window.setInterval(function(){
var text = button.text();
if (text.length < 14){
button.text(text + '.');
} else {
button.text('文件上传中');
}
}, 200);
},
onComplete: function(file, response ){
button.text('文件上传');
window.clearInterval(interval);
this.enable();
data = eval("("+response+")");
}
});
});
4、 创建php(ci框架)处理程序
#$this->upload->do_upload() 用ci框架接收图片,也可用原生态的php接收,或者其他框架
#echo 0 向客户端返回数据
#echo 1 向客户端返回数据
public function upload_pic(){
$this->load->library("upload", $config);
if (!$this->upload->do_upload()){
echo 0;
}else{
echo 1;
}
}
Ajaxupload插件超级简单使用(php的ci框架)的更多相关文章
- vcastr2.0插件超级简单使用
Vcastr2.0简单使用 友情提示:1.蓝色文字为必修改内容.2.#字符后面是解释该代码段的主要内容 1. 引用swfobject.js文件 #public/videoplu ...
- jquery超级简单的后台系统自适应框架
系统后台自适应简单框架 <!DOCTYPE HTML> <html lang="zh-CN"> <head> <meta http-equ ...
- Notyf - 超级简单、响应式的 JS 通知插件
通知是网站的常用功能之一,可以用来显示消息.通告.提示等等.Notyf 是一款超级简单.响应式的 JS 通知插件,不依赖 jQuery 库,可以独立使用.赶紧试用一下吧! 在线演示 免费下载 ...
- 【CI3.1】CI框架简单使用方法
CI框架简单使用方法 1.回忆MVC 1.1.M:模型,提供数据,保存数据 1.2.V:视图,只负责显示,表单form 1.3.C:控制器,协调模型和视图 1.4.action:动作,是控制器中的方法 ...
- VUE图片懒加载-vue lazyload插件的简单上手使用(优化版本)
在用VUE做项目开发的过程中,首页用到了懒加载的方法,查找了一些方法,觉得官网写得太复杂,有一篇博客不错(https://www.cnblogs.com/xyyt/p/7650539.html),但是 ...
- 基于jquery的bootstrap在线文本编辑器插件Summernote 简单强大
Summernote是一个基于jquery的bootstrap超级简单WYSIWYG在线编辑器.Summernote非常的轻量级,大小只有30KB,支持Safari,Chrome,Firefox.Op ...
- Xcode7使用插件的简单方法&&以及怎样下载到更早版本的Xcode
Xcode7自2015年9上架以来也有段时间了, 使用Xcode7以及Xcode7.1\Xcode7.2的小伙伴会发现像VVDocumenter-Xcode\KSImageNamed-Xcode\HO ...
- CI框架使用PHPmail插件发送QQ邮件:
有助请顶,不好请评.0:33 2016/3/12CI框架使用PHPmail插件发送QQ邮件:发送成功,不过修改了主机参数,还包含了一个phpmail中的一个另外的文件,详见下方:参见:http://c ...
- CI框架如何在主目录application目录之外使用uploadify上传插件和bootstrap前端框架:
19:29 2016/3/10CI框架如何在主目录application目录之外使用uploadify上传插件和bootstrap前端框架:项目主路径:F:\wamp\www\graduationPr ...
随机推荐
- 【Android】数据存储-java IO流文件存储
1.数据持久化:将在内存中的瞬时数据保存在存储设备中.瞬时数据:设备关机数据丢失.持久化技术提供一种机制可以让数据在瞬时状态和持久状态之间转换. 2.Android中简单的三种存储方式:文件存储.Sh ...
- CEO、COO、CFO、CTO
CEO.COO.CFO.CTO是什么意思? 网站里的各种职位: CEO(Chief executive officer)首席执行官 类似总经理.总裁,是企业的法人代表. COO(Chief opera ...
- Ionic 弹出窗
Ionic弹窗服务允许程序创建.显示弹出窗口,需要用户继续响应. 弹窗系统支持更多灵活的构建alert(),prompt()和confirm()功能版本,以及用户习惯,除了允许查看完全自定义内容的的弹 ...
- java问题:类的定义,对象的定义?
java问题:类的定义,对象的定义? 类是一组数据和函数的集合,只是抽象的概念,它的作用就是生成对象,它生成对象后,就为这个对象分了一块存储区,类可以生成无限多个对象,每个对象都有自己的存储区,在类里 ...
- .NET设计模式(8):适配器模式(Adapter Pattern)
):适配器模式(Adapter Pattern) 适配器模式(Adapter Pattern) --.NET设计模式系列之八 Terrylee,2006年2月 概述 在软件系统中,由于应用环境的 ...
- Windows Azure 试用 for 世纪互联运维
前一段时间申请由世纪互联运维的和谐版Windows Azure的邀请嘛下来,今天花费了点时间注册了一下 注册邀请函, 根据提示输入邀请码之后会收到以下邮件 中国地区可选择建立的虚拟机,SQL Serv ...
- iOS 跳转到应用所在的App Store市场
代码入下 #import "ViewController.h" @interface ViewController ()<UIWebViewDelegate> @end ...
- Github上图文演示仓库创建
1.注册账号 https://github.com/ 2.注册完账号 创建仓库 a.点击按钮 Start a project b.填写信息,点击按钮 Create repository c.仓库信息( ...
- DOM对象与Jquery对象区别
- apache2.4配置虚拟主机
step1 启用 httpd-vhosts.conf 找到E:/apache/Apache24/conf 中httpd.conf 文件,取消注释下面这句话 step2 在 httpd-vhosts.c ...