《五》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 ...
随机推荐
- [terry笔记]11gR2_DataGuard搭建_拷贝数据文件
11gR2搭建dataguard环境: 自己做的实验,后续按照rman模式搭建.主备切换.模式调整等实验会陆续发上来. primary: OS:oel 6.4 database:11.2.0.4.0 ...
- 数位DP CF388D - Fox and Perfect Sets
题目地址 一个整数perfect集合满足性质:集合中随意两个整数的异或和仍在这个集合中. 求最大数不超过K的perfect集合的个数. 每一个集合都是一个线性的向量空间. .能够通过全然的高斯消元得出 ...
- Mongodb集群之副本集
上篇咱们遗留了几个问题 1主节点是否能自己主动切换连接? 眼下须要手动切换 2主节点读写压力过大怎样解决 3从节点每一个上面的数据都是对数据库全量拷贝,从节点压力会不会过大 4数据压力达到机器支撑不了 ...
- Android Stuido 好卡怎么办?不要急,兄弟来教你
近期使用Android studio 开发app,编译的时候特别卡,常常卡死.我的机器 i3 + 8G,按道理来说流畅的跑个androidstudio还是绰绰有余的... 于是在各大论坛寻找解决方式, ...
- sklearn.preprocessing OneHotEncoder——仅仅是数值型字段才可以,如果是字符类型字段则不能直接搞定
>>> from sklearn.preprocessing import OneHotEncoder >>> enc = OneHotEncoder() > ...
- Hive框架基础(一)
* Hive框架基础(一) 一句话:学习Hive有毛用? 那么解释一下 毛用: * 操作接口采用类SQL语法,提供快速开发的能力(不会Java也可以玩运算) * 避免了去写MapReduce,减少开发 ...
- 解决高版本vm打开虚拟机报错
问题: 打开虚拟机的文件目录,找到.vmx 文件 用记事本打开重命名后的“.vmx.txt”文件 找到行:policy.vm.mvmtid = "52 10 08 ed ff 34 ed d ...
- 01背包-第k优解
The title of this problem is familiar,isn't it?yeah,if you had took part in the "Rookie Cup&quo ...
- linux傻瓜式安装lnmp
一.百度 https://lnmp.org/install.html 二.点击 <安装> 三.登录 linux cd /usr/local/ wget -c http://soft.vps ...
- Haproxy实现web的页面的动静分离
一.Haproxy概述: 概述:Haproxy是一个开源的高性能的反向代理或者说是负载均衡服务软件之一,由C语言编写而成,支持会话保持.七层处理.健康检查.故障修复后自动加载.动静分离.HAProxy ...