本想着文件上传是一件挺简单的事，不过是获取文件地址保存到服务器而已，然而事实并非如此。
我信心满满的写下input type="file"，alert input 的value，打开页面选择了张图片，在获取地址的时候，问题出现了，为什么得到的地址是"C:\fakepath\*.jpg"，带着疑惑百度了一圈，原来这是浏览器的安全机制，不让获取文件的物理路径，所以以假路径代替。顿时信心锐减，出师不利啊，看来是轻敌了。
不过百度是个好老师，总能教给你解决问题的办法，一番搜索后，发现了一款上传神器，jquery.form.js，其ajaxSubmit()方法是专门为解决上传问题而生的。
下面就展示一下上传的过程吧。
1.html源码
要上传图片，首先要把file放在form里，异步提交表单，form中需要添加 method="post" enctype="multipart/form-data" 等属性
<!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>
<title>upload</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<form id="uploadform" method="post" enctype="multipart/form-data">
<input name="uploadimg" id="uploadimg" type="file" style="width: 100%" />
</form>
<img id="myimg" style="width: 80px; height: 80px;border:solid 1px #ccc; border-radius:40px; background-color:#ccc;" /> <script type="text/javascript" src="js/jquery-1.4.1.js"></script>
<script type="text/javascript" src="js/jquery.form.js"></script>
<script type="text/javascript" src="js/upload.js"></script>
</body>
</html>
2.Js文件upload.js代码
$(function () {
//file内容改变触发表单提交事件
$("#uploadimg").change(function () {
$("#uploadform").ajaxSubmit({
url: "Upload.ashx?action=upload",
type: "post",
beforeSubmit: function () {
$("#myimg").attr("src", "images/loading.gif");
},
success: function (url) {
if (url) {
setTimeout(function () {
$("#myimg").fadeOut(1000, function () {
$("#myimg").attr("src", url);
});
$("#myimg").fadeIn(1000);
}, 100);
}
}
});
return false;
});
});
3.一般处理程序Upload.ashx代码
<%@ WebHandler Language="C#" Class="Upload" %> using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.IO; public class Upload : IHttpHandler { public void ProcessRequest (HttpContext context) {
context.Response.ContentType = "text/html"; //设置response的返回值类型text/html，否则会自动加<pre>标签
string act = context.Request.QueryString["action"].ToString(); switch (act)
{
case "upload":
ImgUpload(context);
break;
}
} /// <summary>
/// 上传图片至服务器
/// </summary>
/// <param name="context"></param>
public void ImgUpload(HttpContext context)
{
List<string> filelist = new List<string>();
HttpFileCollection files = context.Request.Files;
for (int i = ; i < files.Count; i++)
{
string filename = System.IO.Path.GetFileName(files[i].FileName);
filelist.Add(filename);
string imgpath = "images\\upload\\";
string bootpath = HttpRuntime.AppDomainAppPath + imgpath;
string name = DateTime.Now.ToString("yyyy-MM-dd_HHmmss") + "_" + filename;
if (!File.Exists(bootpath + name))
{
files[i].SaveAs(bootpath + name);
}
string localPath = imgpath + name;
context.Response.Write(localPath);
context.Response.End();
} } public bool IsReusable {
get {
return false;
}
} }
4.附上Demo
此demo是网站，下载后发布在iis或者新建个解决方案把它加进去就可以浏览了。
http://files.cnblogs.com/Jackie-sky/Upload.rar
如果大家在上传方面有其它的解决方法，望不吝赐教。