下载地址: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插件上传文件的更多相关文章

  1. 用jquery uploadify上传插件上传文件

    public void ProcessRequest(HttpContext context) { string esOIDs = System.Web.HttpContext.Current.Req ...

  2. 完整uploadify批量上传文件插件使用

    1.首先准备uploadify的js文件,网上一搜一大堆 2.上传页面UpFilePage.aspx 关键代码: <html xmlns="http://www.w3.org/1999 ...

  3. uploadify前台上传文件,java后台处理的例子

    1.先创建一个简单的web项目upload (如图1-1) 2.插件的准备 (1).去uploadify的官网下载一个uploadify插件,然后解压新建个js文件夹放进去(这个不强求,只要路径对了就 ...

  4. Extjs 使用fileupload插件上传文件 带进度条显示

    一.首先我们看看官方给出的插件的解释: 一个文件上传表单项具有自定义的样式,并且可以控制按钮的文本和 像文本表单的空文本类似的其他特性. 它使用一个隐藏的文件输入元素,并在用户选择文件后 在form提 ...

  5. uploadify+批量上传文件+java

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  6. 在Struts2中使用Uploadify组件上传文件

    Uploadify是一个基于Jquery的文件上传组件,官网http://www.uploadify.com/可以在官网获得该组件,运行演示示例,下载帮助文档.     作为Web前端的增强技术,Jq ...

  7. fileInput插件上传文件

    一.ftl <form action="" method="post" name="form" id="form" ...

  8. 菜鸟学SSH(五)——Struts2上传文件

    上传文件在一个系统当中是一个很常用的功能,也是一个比较重要的功能.今天我们就一起来学习一下Struts2如何上传文件. 今天讲的上传文件的方式有三种: 1,以字节为单位传输文件: 2,Struts2封 ...

  9. asp.net配置web.config支持jQuery.Uploadify插件上传大文件

    配置web.config有两处地方需要配置,分别是集成模式和经典模式. 集成模式: <!--文件上传大小设置--> <httpRuntime requestValidationMod ...

随机推荐

  1. [terry笔记]11gR2_DataGuard搭建_拷贝数据文件

    11gR2搭建dataguard环境: 自己做的实验,后续按照rman模式搭建.主备切换.模式调整等实验会陆续发上来. primary: OS:oel 6.4 database:11.2.0.4.0 ...

  2. 数位DP CF388D - Fox and Perfect Sets

    题目地址 一个整数perfect集合满足性质:集合中随意两个整数的异或和仍在这个集合中. 求最大数不超过K的perfect集合的个数. 每一个集合都是一个线性的向量空间. .能够通过全然的高斯消元得出 ...

  3. Mongodb集群之副本集

    上篇咱们遗留了几个问题 1主节点是否能自己主动切换连接? 眼下须要手动切换 2主节点读写压力过大怎样解决 3从节点每一个上面的数据都是对数据库全量拷贝,从节点压力会不会过大 4数据压力达到机器支撑不了 ...

  4. Android Stuido 好卡怎么办?不要急,兄弟来教你

    近期使用Android studio 开发app,编译的时候特别卡,常常卡死.我的机器 i3 + 8G,按道理来说流畅的跑个androidstudio还是绰绰有余的... 于是在各大论坛寻找解决方式, ...

  5. sklearn.preprocessing OneHotEncoder——仅仅是数值型字段才可以,如果是字符类型字段则不能直接搞定

    >>> from sklearn.preprocessing import OneHotEncoder >>> enc = OneHotEncoder() > ...

  6. Hive框架基础(一)

    * Hive框架基础(一) 一句话:学习Hive有毛用? 那么解释一下 毛用: * 操作接口采用类SQL语法,提供快速开发的能力(不会Java也可以玩运算) * 避免了去写MapReduce,减少开发 ...

  7. 解决高版本vm打开虚拟机报错

    问题: 打开虚拟机的文件目录,找到.vmx 文件 用记事本打开重命名后的“.vmx.txt”文件 找到行:policy.vm.mvmtid = "52 10 08 ed ff 34 ed d ...

  8. 01背包-第k优解

    The title of this problem is familiar,isn't it?yeah,if you had took part in the "Rookie Cup&quo ...

  9. linux傻瓜式安装lnmp

    一.百度 https://lnmp.org/install.html 二.点击 <安装> 三.登录 linux cd /usr/local/ wget -c http://soft.vps ...

  10. Haproxy实现web的页面的动静分离

    一.Haproxy概述: 概述:Haproxy是一个开源的高性能的反向代理或者说是负载均衡服务软件之一,由C语言编写而成,支持会话保持.七层处理.健康检查.故障修复后自动加载.动静分离.HAProxy ...