Uploadify学习笔记

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

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

 

在这么多文档中我们需要的就是uplodify.css和uploadify.swf、uploadify-cancle.png、jquery-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

 

 

 

转载于:https://www.cnblogs.com/zxdBlog/archive/2012/11/17/2774877.html