文档章节

Uploadify学习笔记

JavaSwing
 JavaSwing
发布于 2016/11/29 11:09
字数 574
阅读 6
收藏 0

前言:这几天做项目的需要学习了一下uploadify这个jquery插件如何使用的,我在网上也找了好的资料,他们发的都是旧的,是v2.x的,我从下载的是v3.2的,我自己在官网学习了一个这个插件的使用方法,官方默认的使用的是PHP语言,这里的笔记我用的是C#语言写的(参考的是网上的资料)。

Uploadify下载地址:http://www.uploadify.com这里下载的是最新版的v3.2,下载下来之后是会有很多的文件这是我下载的图:

 

在这么多文档中我们需要的就是uplodify.cssuploadify.swfuploadify-cancle.pngjquery-uploadify.min.js(jquery-uploadify.js中的其中一个),当然了还有就是jquery库哦!

我做的项目的目录:

这是我建立一个Default.aspx文件的内容:

 <link href="css/uploadify.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.uploadify.min.js" type="text/javascript"></script>

 

<%//引入相应的文件 %>
    <link href="css/uploadify.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.uploadify.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('#uploadify').uploadify({
                //'debug':'false',                         //是否调试
                //'buttonClass': 'buttonSum',           //按钮的样式
                //'buttonCursor':'hand',                 //按钮的Cursor
                'fileTypeDesc': 'Web Files',             //允许文件的描述
                'fileTypeExts': '*.gif; *.jpg; *.png',  //文件的种类(必须和fileTypeDesc一起使用)
                'uploader': 'UploadHandler.ashx',    //处理的后台程序
                'swf': 'js/uploadify.swf',          //引入swf文件
                'cancelImg': 'img/uploadify-cancel.png', //退出的图片
                'auto': 'true',                          //是否自动上传
                'buttonText': '选择文件',                  //按钮的文本
                'folder': '/Uploads',                      //服务器端的路径
                'fileSizeLimit': '0',                       //上传文件的大小               
                'onSelect':function(file){                  //选择完成后的回调函数                   
                    alert(file.name);
                },
                'onUploadComplete': function (file) {       //上传完成的回调事件
                    alert('上传成功');
                }
            });
        });  
    </script>

还有有就是UploadHandler.ashx的内容

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.IO;

namespace UploadifyDemo
{
    /// <summary>
    /// UploadHandler 的摘要说明
    /// </summary>
    public class UploadHandler : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            context.Response.Charset = "utf-8";

            HttpPostedFile file = context.Request.Files["Filedata"];
            string uploadPath = HttpContext.Current.Server.MapPath("\\Uploads" + "\\");
            if (file != null)
            {
                if (!Directory.Exists(uploadPath))
                {
                    Directory.CreateDirectory(uploadPath);
                }
                file.SaveAs(uploadPath + file.FileName);
                //下面这句代码缺少的话,上传成功后上传队列的显示不会自动消失
                context.Response.Write("1");
            }
            else
            {
                context.Response.Write("0");
            }  
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

    以上就是这个例子,本人也是初学!

    还有我在网上找到到几个不错的文章可以参考:http://www.abc3210.com/2012/js_09/jquery-uploadify.shtml 

                         http://www.cnblogs.com/akingyao/archive/2012/09/04/2670794.html

 

 

 

本文转载自:http://www.cnblogs.com/zxdBlog/archive/2012/11/17/2774877.html

JavaSwing
粉丝 21
博文 44
码字总数 8095
作品 0
杭州
程序员
私信 提问
Uploadify——学习(1):在Struts2的使用

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

凡尘里的一根葱
2015/09/12
17
0
uploadify无法删除队列

如题,有人遇到这个问题么?有研究过的请指教. $("#uploadify").uploadify({ 'uploader': 'uploadify-v2.1.4/uploadify.swf', 'script': 'fileUpload.php', 'cancelImg': 'uploadify-v2.1.4/ca......

Ian1982
2012/03/22
4.1K
5
Web开发中的文件上传组件uploadify的使用

在Web开发中,有很多可以上传的组件模块,利用HTML的File控件的上传也是一种办法,不过这种方式,需要处理的细节比较多,而且只能支持单文件的操作。在目前Web开发中用的比较多的,可能uploa...

walb呀
2017/12/04
0
0
uploadify的itemTemplate没有效果,版本3.2

$ ( function ( ) { $ ( "#file_upload" ) . uploadify ( { 'swf' : '/uploadify/uploadify.swf' , 'uploader' : '/uploadify/uploadify.php' , 'itemTemplate' : ' \ \ X\ \ ${fileName} ($......

小小志
2013/04/26
1K
2
Laravel使用Layui上传并显示图片操作

这个问题已经困扰好久了,唉 比较难受,本来学习laravel使用的是Bootstrap,之后用的是Uploadify进行上传图片,无奈,这个技术需要Flash的支持,一直没有实现,后来思考再三,还是选择用Lay...

Debug客栈
05/03
0
0

没有更多内容

加载失败,请刷新页面

加载更多

OSChina 周日乱弹 —— 别问,问就是没空

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @tom_tdhzz :#今日歌曲推荐# 分享容祖儿/彭羚的单曲《心淡》: 《心淡》- 容祖儿/彭羚 手机党少年们想听歌,请使劲儿戳(这里) @wqp0010 :周...

小小编辑
今天
226
4
golang微服务框架go-micro 入门笔记2.1 micro工具之micro api

micro api micro 功能非常强大,本文将详细阐述micro api 命令行的功能 重要的事情说3次 本文全部代码https://idea.techidea8.com/open/idea.shtml?id=6 本文全部代码https://idea.techidea8....

非正式解决方案
今天
5
0
Spring Context 你真的懂了吗

今天介绍一下大家常见的一个单词 context 应该怎么去理解,正确的理解它有助于我们学习 spring 以及计算机系统中的其他知识。 1. context 是什么 我们经常在编程中见到 context 这个单词,当...

Java知其所以然
昨天
5
0
Spring Boot + Mybatis-Plus 集成与使用(二)

前言: 本章节介绍MyBatis-Puls的CRUD使用。在开始之前,先简单讲解下上章节关于Spring Boot是如何自动配置MyBatis-Plus。 一、自动配置 当Spring Boot应用从主方法main()启动后,首先加载S...

伴学编程
昨天
8
0
用最通俗的方法讲spring [一] ──── AOP

@[TOC](用最通俗的方法讲spring [一] ──── AOP) 写这个系列的目的(可以跳过不看) 自己写这个系列的目的,是因为自己是个比较笨的人,我曾一度怀疑自己的智商不适合干编程这个行业.因为在我...

小贼贼子
昨天
8
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部