asp.net+jquery.form实现图片异步上传的方法(附jquery.form.js下载)
本文实例讲述了asp.net+jquery.form实现图片异步上传的方法。分享给大家供大家参考，具体如下：
首先我们需要做准备工作：
jquery 点击此处本站下载。
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="JS/jquery-1.8.0.js" type="text/javascript"></script>
<script src="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 = data.replace("<PRE>", "").replace("</PRE>", "");
$("#divimg").append("<img src='" + 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="提交" />
<br />
<input type="button" id="btn" value="上传" />
</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;
}
}
}
更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery切换特效与技巧总结》、《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》、《jquery选择器用法总结》及《jQuery常用插件及用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
-
本文向大家介绍ASP.NET图片上传实例（附源码），包括了ASP.NET图片上传实例（附源码）的使用技巧和注意事项，需要的朋友参考一下 由于需要图片上传的功能，所以花了一些时间网上找相关资料终于搞定，效果图如下： 下面的是解决方案截图和上传的图片截图： 下面是代码： 1.界面代码 2.后台代码 3.最后防止上传大文件图片时报错，配置文件添加配置 ASP.NET图片自动上传和局部刷新显示的源码下载。
-
快速上手 demo 地址 https://github.com/ChenShenhai/koa2-note/tree/master/demo/upload-async 源码理解 demo源码目录 . ├── index.js # 后端启动文件 ├── node_modules ├── package.json ├── static # 静态资源目录 │ ├── image # 异步上传图片存储
-
本文向大家介绍ajax图片上传，图片异步上传，更新实例，包括了ajax图片上传，图片异步上传，更新实例的使用技巧和注意事项，需要的朋友参考一下 最近在研究ajax图片上传，图片异步上传，更新，留作参考。 直接上源码吧： js源码： js: html代码： 服务器端使用一般处理程序： 程序使用的是framework4.0，所以使用了一些扩展方法。 JsonTesult类代码： StatusMess
-
本文向大家介绍thinkphp ajaxfileupload实现异步上传图片的示例，包括了thinkphp ajaxfileupload实现异步上传图片的示例的使用技巧和注意事项，需要的朋友参考一下 thinkphp开发图片上传，图片异步上传是目前比较方便的功能,这里我就不写css文件了，将代码写出来。引入核心文件下载https://github.com/carlcarl/A... HTML 下面
-
本文向大家介绍php+js实现异步图片上传实例分享，包括了php+js实现异步图片上传实例分享的使用技巧和注意事项，需要的朋友参考一下 upload.php index.html
-
本文向大家介绍ajax实现异步文件或图片上传功能，包括了ajax实现异步文件或图片上传功能的使用技巧和注意事项，需要的朋友参考一下 大家好，这篇文章我要给大家分享一个网页文件上传功能的代码，希望大家可以有所参考，或者给我提些建议。 众所周知现在的各大网站基本都设有文件上传功能，用户可以把自己喜欢的图片或其他文件放在网上存起来，以便以后用的时候方便去找，可是一个网页的文件上传功能究竟该怎么去设置呢？