而且未建立统一上传函数。于是将代码改造了。心想来个ajax异步上传图片吧，这技术应该很老套了。于是直接打开强大的cnblogs轻松的找到了 这篇文章 直接依葫芦画瓢，将该作者的劳动成果直接“拿来主义了”。很快就把代码全改造了。可是当我把程序发布到服务器上的时问题来了。上传文件失效了！汗～ 都是偷懒造成的恶果。继续打开先前参考的那篇文章。原来作者解释了只能在本地使用而不能发布到服务器上。心想我难道还得用 iframe + http post 这个 郁闷的方式么？？ 于是不甘心的我打开了更加强大的google，开始全球搜索寻求解决方案，终于功夫不负有心人。找到了 "jquery.form.js" 。 异步上传图片的步骤如下： 1.引用 jquery js 框架（这东西的好处无需多论）后再引用 “jquery.form.js”。 2.建立一般处理程序 ashx。 核心代码如下： html: 复制代码 代码如下: <asp:Content ID="Content3" ContentPlaceHolderID="Head" runat="server"> <script src="<%=Url.Content("~/Scripts/jquery-1.4.1.js") %>" type="text/javascript"></script> <script src="<%=Url.Content("~/Scripts/jquery.form.js") %>" type="text/javascript"></script> <script type="text/javascript"> $(function () { //上传图片 $("#btnUpload").click(function () { if ($("#flUpload").val() == "") { alert("请选择一个图片文件，再点击上传。"); return; } $('#UpLoadForm').ajaxSubmit({ success: function (html, status) { var result = html.replace("<pre>", ""); result = result.replace("</pre>", ""); $("#image").attr('src', result); alert(result); } }); }); }); ashx 如下： 复制代码 代码如下: namespace TestMvc.Utility { /// <summary> /// Summary description for PicUploadHander /// </summary> public class PicUploadHander : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; //验证上传的权限TODO string _fileNamePath = ""; try { _fileNamePath = context.Request.Files[0].FileName; //开始上传 string _savedFileResult = UpLoadImage(_fileNamePath, context); context.Response.Write(_savedFileResult); } catch { context.Response.Write("上传提交出错"); } } 注：整个上传使用ajax 异步数据，同时jquery回调出上传成功后图片在服务器上的相对路径。总的来说此方式相对传统的上传图片方式要强一些。 本例代码在此下载，FireFox 下测试通过。http://xiazai.jb51.net/201011/yuanma/AjaxUploadPic.rar

　　推荐阅读

　　CSS导航菜单，三级菜单实现代码

CSS导航 首页 关于我们 公司简介 董事长&总裁 发展历程 公司荣誉 产品&服务 产品1 配套 配件 产品2 产品2-1 产品2-2 服务 服务111 服务112 服务113 服务114 服务>>>详细阅读

本文标题：Jquery ajaxsubmit上传图片实现代码

地址：http://www.17bianji.com/kaifa2/JS/25479.html

 1/2    1