ajax无刷新上传文件，使用iframe模仿
其实ajax是无法上传文件的，所以得用隐藏的iframe来模仿
ajax未出现之前，一直都是隐藏的iframe来实现无刷新操作
如果谁看过图灵程序设计丛书的Ajax高级编程，就知道了。
示例下载点击这里
下面列出代码，asp的上传代码太麻烦，就使用。net了。。。
upload.ashx
<%@ WebHandler?Language="C#" Class="upload" %>
using System;
using System.Web;
public class upload : IHttpHandler {
private string Js(string v) {//此函数进行js的转义替换的，防止字符串中输入了'后造成回调输出的js中字符串不闭合
if (v == null) return "";
return v.Replace("'", @"\'");
}
//下面就是一个简单的示例，保存上传的文件，如果要验证上传的后缀名，得自己写，还有写数据库什么的
public void ProcessRequest (HttpContext context) {
HttpRequest Request = context.Request;
HttpResponse Response = context.Response;
HttpServerUtility Server = context.Server;
//指定输出头和编码
Response.ContentType = "text/html";
Response.Charset = "utf-8";
HttpPostedFile f = Request.Files["upfile"];//获取上传的文件
string des = Request.Form["des"]//获取描述
,newFileName=Guid.NewGuid().ToString();//使用guid生成新文件名
if (f.FileName == "")//未上传文件
Response.Write(" ");//输出js，使用parent对象得到父页的引用
else { //保存文件
newFileName += System.IO.Path.GetExtension(f.FileName);//注意加上扩展名
try {
f.SaveAs(Server.MapPath("~/uploads/" + newFileName));//如果要保存到其他地方，注意修改这里
//调用父过程更新内容，注意要对des变量进行js转义替换，防止字符串不闭合提示错误
Response.Write("<script>alert('上传成功！')</script>");
}
catch {
Response.Write("<script>alert('发生错误！')</script>");//如果保存失败，输出js提示保存失败
}
}
}
public bool IsReusable {
get {
return false;
}
}
}
test.htm
<!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>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>使用隐藏的Iframe实现ajax无刷新上传</title>
</head>
<body>
<script type="text/javascript">
function UpdateMsg(des,filename){//此函数用来提供给提交到的页面如upload.ashx输出js的回调，更新当前页面的信息
if(filename==''){alert('未上传文件！');return false;}
document.getElementById('ajaxMsg').innerHTML='你在表单中输入的“文件描述”为：'+des+'
'
+'上传的图片为：'+filename+'';
}
function check(f){
if(f.des.value==''){
alert('请输入文件描述！');f.des.focus();return false;
}
if(f.upfile.value==''){
alert('请选择文件！');f.upfile.focus();return false;
}
}
</script>
<iframe name="ajaxifr" style="display:none;"></iframe>
<form method="post" enctype="multipart/form-data" action="upload.ashx" target="ajaxifr" onsubmit="return check(this)">
文件描述：<input type="text" name="des" /><br >
选择文件：<input type="file" name="upfile" /><br >
<input type="submit" value="提交" />
</form>
<div id="ajaxMsg"></div>
</body>
</html>
如果不想动态页输出脚本，而是JSON之类的内容，可以给iframe添加onload事件获取动态页返回的内容
<iframe name="ajaxifr" style="display:none;" onload="alert('服务器返回的内容：\n\n'+this.contentWindow.document.body.innerHTML)"></iframe>
加支付宝好友偷能量挖...
原创文章，转载请注明出处：ajax无刷新上传文件，使用iframe模仿