花了差不多一下午的时间，总算把uploadify插件运行起来，在此对自己遇到的问题以及过程做一个小结。
一.使用步骤
1.在官网下载最新的插件包，并将包解压。
2.新建asp web项目，将解压得到的包放入项目中。
3.在建好的项目中右键添加Generic Handler类型文件后缀为ashx，用于接收通过插件传过来的文件流，并做相关处理，将文件存入指定文件夹等操作。
4.新建存放上传文件的文件夹，新建操作页面。
项目结构图
5.在操作页面中UploadFile.asp中添加引用文件css和js文件。
<link href="JS/uploadify/uploadify.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/uploadify/jquery-1.4.1.min.js"></script> <script type="text/javascript" src="js/uploadify/jquery.uploadify.js"></script>
6.UploadFile.asp中的代码
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UploadFile.aspx.cs" Inherits="test.UploadFile" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="JS/uploadify/uploadify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/uploadify/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="js/uploadify/jquery.uploadify.js"></script>
<script type="text/javascript">
$(function () {
$("#uploadify").uploadify({
//指定swf文件
‘swf‘: ‘js/uploadify/uploadify.swf‘,
//后台处理的页面
‘uploader‘: ‘UploadHandler.ashx‘,
//按钮显示的文字
‘buttonText‘: ‘上传图片‘,
//显示的高度和宽度，默认 height 30；width 120
//‘height‘: 15,
//‘width‘: 80,
//上传文件的类型 默认为所有文件 ‘All Files‘ ; ‘*.*‘
//在浏览窗口底部的文件类型下拉菜单中显示的文本
‘fileTypeDesc‘: ‘Image Files‘,
//允许上传的文件后缀
‘fileTypeExts‘: ‘*.gif; *.jpg; *.png‘,
//发送给后台的其他参数通过formData指定
//‘formData‘: { ‘someKey‘: ‘someValue‘, ‘someOtherKey‘: 1 },
//上传文件页面中，你想要用来作为文件队列的元素的id, 默认为false 自动生成, 不带#
//‘queueID‘: ‘fileQueue‘,
//选择文件后自动上传
‘auto‘: false,
//设置为true将允许多文件上传
‘multi‘: true
});
});
</script>
</head>
<body>
<%--fileQueue div为文件队列区域--%>
<div id="fileQueue">
</div>
<input type="file" name="uploadify" id="uploadify" />
<p>
<a href="javascript:$(‘#uploadify‘).uploadify(‘upload‘,‘*‘)">上传</a>|
<a href="javascript:$(‘#uploadify‘).uploadify(‘cancel‘)">取消上传</a>
</p>
</body>
</html>
7.一般处理程序文件UploadHander.ashx文件中的代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.IO;
namespace test
{
/// <summary>
/// Summary description for UploadHandler
/// </summary>
public class UploadHandler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
//接收上传文件
HttpPostedFile file = context.Request.Files["Filedata"];
//获取文件的保存路径
string uploadPath =
HttpContext.Current.Server.MapPath("UploadImages" + "\\");
//判断上传的文件是否为空
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;
}
}
}
}
二.遇到问题以及注意事项
1.新版的参数可能会有变化，在使用过程中，出现点击选择图片按钮之后没有反应。查来查去不得其解，后来终于发现新版本中
指定swf文件参数设置为：‘swf‘: ‘js/uploadify/uploadify.swf‘,而在旧版本中为‘uploader‘: ‘JS/jquery.uploadify-v2.1.0/uploadify.swf‘,
2.官网上有较为详细的使用方法，参数说明等可以参考使用。
三.参考文章连接
时间： 2024-10-12 09:08:25