Asp.net使用ajax无刷新上传文件（附源码）

来源：互联网发布：北京租房知乎编辑：程序博客网时间：2024/05/17 23:15

原文引用自：http://www.cnblogs.com/hyl8218/archive/2009/12/21/1629210.html

利用JQuery插件jquery.ajaxfileupload.js实现无刷新上传文件，插件原理是在文档中创建iframe和form然后在将文件上传到服务器。

<html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <title>ajax上传文件</title> <mce:script type="text/javascript" src="/js/jquery.js" mce_src="js/jquery.js"></mce:script> <mce:script type="text/javascript" src="/js/jquery.ajaxfileupload.js" mce_src="js/jquery.ajaxfileupload.js"></mce:script> <mce:script type="text/javascript"></mce:script></head><body> <form id="form1" runat="server"> <div> <asp:FileUpload ID="fup" runat="server" /> <img id="tmp" /> <asp:TextBox ID="tb" runat="server"></asp:TextBox> <asp:HiddenField ID="hf" runat="server" /> </div> </form></body></html>

后台代码：

protected void Page_Load(object sender, EventArgs e) { HttpFileCollection files = Request.Files; if (files != null && files.Count > 0) { HttpPostedFile file = files[0]; string tmpPath = Server.MapPath("/Upload/"); string fileName = Path.GetFileName(file.FileName); try { file.SaveAs(tmpPath + fileName); Response.Write(@"{ status : 'success', msg: { Origin : '" + "/upload/" + fileName + @"' } }"); } catch (Exception ex) { Response.Write(@"{ status : 'error', msg : '" + ex.Message + @"' }"); Response.End(); } }

源码：Ajax无刷新上传文件示例源码