下载地址: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. Linux入门基础(一)

    UNIX/Linux 本身是没有图形界面的,我们通常在 UNIX/Linux 发行版上看到的图形界面实际都只是运行在 Linux 系统之上的一套软件XFree86,现在则是 xorg(X.Org),而 ...

  2. 没用私服,自己安装下本地jar包,制作坐标

    没用私服的话,自己安装下本地jar包吧.执行下面命令即可. -Dfile 代表jar存在路径.mvn install:install-file -DgroupId=alipay -DartifactI ...

  3. hdu 2191 悼念512汶川大地震遇难同胞——珍惜如今,感恩生活

    #include<stdio.h> #include<string.h> #include<algorithm> using namespace std; int ...

  4. Cannot find the class file for javax.servlet.ServletContext.

    当eclipse中新导入的Java Project的时候.往往会碰到各种各样的问题,以下是个典型的问题: Cannot find the class file for javax.servlet.Se ...

  5. SPOJ1812: LCS2 - Longest Common Substring II & BZOJ2946: [Poi2000]公共串

    [传送门:SPOJ1811&BZOJ2946] 简要题意: 给出若干个字符串,求出这些字符串的最长公共子串 题解: 后缀自动机 这两道题的区别只是在于一道给出了字符串个数,一个没给,不过也差不 ...

  6. 3.bind与仿函数以及普通函数

    #include <iostream> #include <string> #include <vector> #include <algorithm> ...

  7. 关于Mantle使用个人的一些见解

    前一个月,我接触到了Mantle,由于项目采用的是MVC的设计模式,选用好的model也是至关重要的.先介绍下Mantle的使用吧. 首先定义好数据模型: @property (nonatomic, ...

  8. Debian9.5 系统配置持久化iptables规则

    RedHat和SUSE系列下有比较好用的iptables管理工具,可以像控制服务进程一样来对防火墙进行管理及控制,Debian系发行版默认不开启iptables,当然也没有与之相关的能直接管理的工具了 ...

  9. CSS 预处理语言之 less 篇

    less 前言 Less 是一门 CSS 预处理语言,它扩充了 CSS 语言,增加了诸如变量.混合(mixin).函数等功能,让 CSS 更易维护.方便制作主题.扩充. 安装 客户端使用 // 引入 ...

  10. java编程思想--学习心得

    学习Java编程思想,需要了解语言特性,对于各种名词,能够借助项目代码,解释其含义,不借助搜索工具,明白其在什么样场景下使用,会带来什么样的问题,能否避免这类问题. 学习的过程,与软件开发相同,一样是 ...