首页 > 代码库 > asp.net使用jquery.form实现图片异步上传
asp.net使用jquery.form实现图片异步上传
首先我们需要做准备工作：
jquery下载：http://files.cnblogs.com/tianguook/jquery1.8.rar
jquery.form.js下载：http://files.cnblogs.com/tianguook/jquery.form.js
页面JqueryFormTest.aspx：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="JqueryFormTest.aspx.cs" Inherits="JqueryFormTest" %><!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> <script src=http://www.mamicode.com/"JS/jquery-1.8.0.js" type="text/javascript"></script> <script src=http://www.mamicode.com/"JS/jquery.form.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $("#btn").click(function () { $("#fm1").ajaxSubmit({ url: "img.ashx", type: "post", success: function (data) { alert(data); //IE显示图片会默认加上<PRE></PRE>，着必须要把去除掉才能在低版本ie显示 data = http://www.mamicode.com/data.replace("<PRE>", "").replace("</PRE>", ""); $("#divimg").append("<img src=http://www.mamicode.com/‘" + data + "‘ width=‘200px‘ height=‘200px‘/>"); //清空file控件里面的值 var file = $("#btnfile"); file.after(file.clone().val("")); file.remove(); } }); }); }) </script></head><body> <form id="fm1" method="post"> <!--method="post"不能省略，在ie里面必不可少--> <input type="file" id="btnfile" name="btnfile" value=http://www.mamicode.com/"提交" /> <br /> <input type="button" id="btn" value=http://www.mamicode.com/"上传" /> </form> <div id="divimg"> </div></body></html>
img.ashx：
<%@ WebHandler Language="C#" Class="img" %>using System;using System.Web;public class img : IHttpHandler { public void ProcessRequest (HttpContext context) { context.Response.ContentType = "text/plain"; //获取上传的文件的对象 HttpPostedFile img = context.Request.Files["btnfile"]; //获取上传文件的名称 string s = img.FileName; //截取获得上传文件的名称(ie上传会把绝对路径也连带上，这里只得到文件的名称) string str = s.Substring(s.LastIndexOf("\\") + 1); string path = "~/upload/"+ str; //保存文件 img.SaveAs(context.Server.MapPath(path)); //HttpRuntime.AppDomainAppVirtualPath主要是获取应用程序虚拟路径名称，因为响应给页面时不会自动添加而导致无法显示图片 context.Response.Write(HttpRuntime.AppDomainAppVirtualPath + path.Substring(1));//path.Substring(1)用来去除第一个~字符 } public bool IsReusable { get { return false; } }}
asp.net使用jquery.form实现图片异步上传
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。