昨天做了一天的ajax效果的图片上传，就是想让自己学的更加的精一些，所以看了很多第三方的控件，最后还是选择了uploadify这个控件，主要原因是比较容易上手。

首先我们先参考别人的资料（我自己整理了一下）

可选项

文件被添加到队列时，自动上传。图片路径。显示的文本。图片路径。文件的后台脚本的路径。【译者注：应该是ajax方式】上传过程中显示在队列里的数据类型。文件的路径。ataname后台脚本中要处理的file域的名称。【译者注：就是type为file的input的name值】底部的文件类型下拉菜单中显示的文本。上传的文件后缀。【译者注：.jpg/.png等】上传文件夹的路径，文件上传后将被保存于此。后台脚本放送数据的表单方法。文件上传。页面中，你想要用来作为文件队列的元素的id。上传队列中所允许的文件数量。自动移除队列中已经完成上传的项目。文件上传的后台脚本的路径。文件中的脚本访问模式。文件上传时，应该被发送给后台脚本的一个包含name/value键值对以及一些额外信息的json对象。上传的文件数量。上传文件的大小限制，单位为字节。文件的路径。文件的wmode。

事件

	解释

函数)上传队列中的所有文件都完成上传时触发。函数)上传队列每移除一个文件时触发一次。函数)上传开始之前，如果检测到一个同名文件时触发。函数)方法被调用时触发。函数)文件上传时触发一次。函数)上传返回错误时触发。函数)函数)上传队列中的一个文件开始上传时就触发一次。函数)上传过程中触发。函数)文件数量达到上传队列限制时触发。函数)上传队列添加一个文件时触发。函数)上传队列添加一个或一组文件时触发。函数)文件载入完成时触发。

方法

上传组件的一个实例。上传队列移除一个文件。如果文件正在上传，该方法将先取消上传，然后再将文件移除出上传队列。文件移除出上传队列，并且取消正在执行的所有上传。上传。

这里会用到一些参数，但是我们并不需要完全的掌握这些参数，用之前看看有哪些参数，倒是自己会用哪些参数就ok。

由于时间有限，我把核心的代码先发出来，供大家参考：

在标签中先应用css样式路径这里你的可能和我的不一样

接着再在标签中应用js，js代码注意先后顺序，不然会报错。

同样这里路径是改成你自己的路径。uploaddiy是用jquery开发的，那我们就要先应用jquery才可以再使用uploaddiy所以要注意应用js的时候注意先后顺序

接着是核心的HTML代码

<%--上传时的进度条--%>

上传取消上传

写的时候写在form的table表中

接着我们开始完成控件给我们需要完成的接口代码如下：

//用户取消函数
function funCancel(event,ID,fileObj,data) {
jBox.tip('您取消了' + fileObj.name + '操作','info');
return;
}

//图片上传发生的事件
function funComplete(event,response,data) {
//$("#pic").html('<img id="pic" runat="server" src=../upload/' + response + '.jpg style="width:300;height:200px;"/>');
if (response == 0) {
jBox.tip('图片' + fileObj.name + '操作失败','info');
return;
}
$("#pic").attr("src","../upload/" + response).height(200).width(300);
jBox.tip('图片' + fileObj.name + '操作成功','info');
return;
}

//上传发生错误时。
function funError(event,errorObj) {
jBox.tip(errorObj.info);
return;
}

接着我们来完成一般处理时间的文件，代码如下：

HttpPostedFile file = context.Request.Files["Filedata"];
string uploadPath = HttpContext.Current.Server.MapPath(@context.Request["folder"]) + "\";

if (file != null)
{
//if (File.Exists(uploadPath + file.FileName))
//{
// context.Response.Write("3"); //文件已经存在
// return;
//}

string[] fn = file.FileName.Split('.');
string ext = fn[fn.Length - 1];
string filename = DateTime.Now.ToString("yyyyMMddhhmmss")+"."+ext;
if (!Directory.Exists(uploadPath))
{
Directory.CreateDirectory(uploadPath);
}
file.SaveAs(uploadPath + filename);
//下面这句代码缺少的话，上传成功后上传队列的显示不会自动消失
context.Session[context.Session["userName"].ToString()] = filename;

context.Response.Write(filename);
}
else
{
context.Response.Write("0");
}

成功上传返回文件的名字，失败的话返回一个0，js不追返回值，如果是0表示失败，如果不是0则动态的给img加载src。

源码下载：

原文链接：https://www.f2er.com/ajax/47774.html

ajax jQuery uploadify uploadify 图片上传