《五》uploadify插件上传文件
下载地址:http://www.uploadify.com/wp-content/uploads/files/uploadify.zip
相关配置:http://www.uploadify.com/documentation/
一、 html 上传页面:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="__STATIC__/static/uploadify/uploadify.css"/>
</head>
<body>
<input type="file" name="file_upload" id="file_upload" />
<img id="img" src=""/>
</body>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="__STATIC__/static/uploadify/jquery.uploadify.min.js"></script>
<script>
$(function() {
$("#file_upload").uploadify({
'swf' : '__STATIC__/static/uploadify/uploadify.swf',
'uploader' : '{:url("/file")}',
'fileObjName' : 'the_files',
'buttonText' : '图片上传',
'onUploadSuccess' : function(file, data, response) {
if(response){
var obj=JSON.parse(data);
$('#img').attr('src',obj.data);
$('#img').attr('width','200px;');
$('#img').attr('height','200px;');
}
}
});
});
</script>
</html>
二、路由文件:
<?php
use think\Route;
//上传页面
Route::rule('map','index/Index/index','GET');
//接受上传页面
Route::rule('file','api/Upload/index','POST');
三、api/Upload/index 方法:
<?php
namespace app\api\controller;
use think\Controller;
use think\Request;
class Upload extends Controller
{
public function index()
{
$file=request()->file('the_files');
$info = $file->move('uploads');
if($info){
return [
'status'=> 1,
'message'=>'success',
'data'=>DS.$info->getPathname()
];
}else{
// 上传失败获取错误信息
echo $file->getError();
}
}
}
效果:
结束。
《五》uploadify插件上传文件的更多相关文章
- 用jquery uploadify上传插件上传文件
public void ProcessRequest(HttpContext context) { string esOIDs = System.Web.HttpContext.Current.Req ...
- 完整uploadify批量上传文件插件使用
1.首先准备uploadify的js文件,网上一搜一大堆 2.上传页面UpFilePage.aspx 关键代码: <html xmlns="http://www.w3.org/1999 ...
- uploadify前台上传文件,java后台处理的例子
1.先创建一个简单的web项目upload (如图1-1) 2.插件的准备 (1).去uploadify的官网下载一个uploadify插件,然后解压新建个js文件夹放进去(这个不强求,只要路径对了就 ...
- Extjs 使用fileupload插件上传文件 带进度条显示
一.首先我们看看官方给出的插件的解释: 一个文件上传表单项具有自定义的样式,并且可以控制按钮的文本和 像文本表单的空文本类似的其他特性. 它使用一个隐藏的文件输入元素,并在用户选择文件后 在form提 ...
- uploadify+批量上传文件+java
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- 在Struts2中使用Uploadify组件上传文件
Uploadify是一个基于Jquery的文件上传组件,官网http://www.uploadify.com/可以在官网获得该组件,运行演示示例,下载帮助文档. 作为Web前端的增强技术,Jq ...
- fileInput插件上传文件
一.ftl <form action="" method="post" name="form" id="form" ...
- 菜鸟学SSH(五)——Struts2上传文件
上传文件在一个系统当中是一个很常用的功能,也是一个比较重要的功能.今天我们就一起来学习一下Struts2如何上传文件. 今天讲的上传文件的方式有三种: 1,以字节为单位传输文件: 2,Struts2封 ...
- asp.net配置web.config支持jQuery.Uploadify插件上传大文件
配置web.config有两处地方需要配置,分别是集成模式和经典模式. 集成模式: <!--文件上传大小设置--> <httpRuntime requestValidationMod ...
随机推荐
- cogs 181. [USACO Jan07] 最高的牛
181. [USACO Jan07] 最高的牛 ★★ 输入文件:tallest.in 输出文件:tallest.out 简单对比时间限制:1 s 内存限制:32 MB FJ's N ( ...
- 如何检查 Android 应用的内存使用情况
Android是为移动设备而设计的,所以应该关注应用的内存使用情况.尽管Android的Dalvik虚拟机会定期执行垃圾回收操作,但这也不意味着就可以忽视应用在何时何处进行内存分配和释放.为了提供良好 ...
- Ubuntu设置显示桌面快捷键
Ubuntu设置显示桌面快捷键 直接在系统设置中没有效果, 学习了:http://www.cnblogs.com/pluse/p/5286585.html 需要进行安装compizconfig,然后在 ...
- android自己定义圆盘时钟
自己定义圆盘时钟的大概流程:由于圆盘时钟的圆盘是不须要动的,所以不必要加在自己定义的view里面,在view里面仅仅须要绘制秒针和分针时针并控其转动就可以. 下面就是自己定义view的主要代码: pa ...
- LeakCanary:简单粗暴的内存泄漏检測工具
差点儿每一个程序猿在开发的过程中都会遇到内存泄漏.那么我们怎样检測到app是否哪里出现内存泄漏呢?square公司推出了一款简单粗暴的检測内存泄漏的工具-- LeakCanary 什么是内存泄漏? 内 ...
- CSDN博客2014年4月24日清理缓存
亲爱的CSDN博主们.我们将于今天(2014年4月24日)对CSDN博客频道缓存进行清理,假设您登录后发现自己的文章总数.积分.评论数.訪问数出现异常,请不要慌张.您的数据并没有丢失.将会在缓存清理完 ...
- iOS——集成支付宝 private key is NULL
问题描述:将生成的私钥,写进官方demo,还是一直报错:rsa_private read error : private key is NULL 解决方案:需要将RSA私钥转换成PKCS8格式
- vue组件递归的一些理解
自己做个小项目练手,需要用到组件递归,网上查了一些资料,每个代码片段都认识,但是连起来,就一团浆糊. 既然人傻就多思考吧.不明白的点有以下: 1.组件怎么自己调用自己,函数的递归是就是在functio ...
- Python 上下文(Context)学习笔记
前言 最早接触到with语句的时候,是初学python,对文件进行读写的时候,当时文件读写一般都是用open()函数来对文件进行读写,为了防止读写的过程中出现错误,也为了让代码更加的pythonic, ...
- unity 天空盒有缝隙的解决方案
修改天空盒图片的属性:advanced->wrap mode->clamp