ajax+jquery+ashx如何实现上传文件
第一:建立Default.aspx页面
<html>
<head runat="server">
<title>ajax图片上传</title>
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/jquery.form.js" type="text/javascript"></script> <script type="text/javascript">
function upload(){
var path = document.getElementById("File1").value;
var img = document.getElementById("img1");
if($.trim(path)==""){
alert("请选择要上传的文件");
return;
} $("#form1").ajaxSubmit({
success: function (str) {
if(str!=null && str!="undefined"){
if (str == "1") {alert("上传成功");document.getElementById("img1").src="data:images/logo.jpg?"+new Date();/*上传后刷新图片*/}
else if(str=="2"){alert("只能上传jpg格式的图片");}
else if(str=="3"){alert("图片不能大于1M");}
else if(str=="4"){alert("请选择要上传的文件");}
else {alert('操作失败!');}
}
else alert('操作失败!');
},
error: function (error) {alert(error);},
url:'Handler.ashx', /*设置post提交到的页面*/
type: "post", /*设置表单以post方法提交*/
dataType: "text" /*设置返回值类型为文本*/
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<input id="File1" name="File1" type="file" />
<input id="iptUp" type="button" value="上传Logo" onclick="upload()"/>
<img id="img1" alt="网站Logo" src="data:images/weblogo.jpg" />
</form>
</body>
</html>
二、新建一个一般处理文件Handler.ashx
<%@ WebHandler Language="C#" class="Handler" %> using System;
using System.Web; public class Handler : IHttpHandler { public void ProcessRequest (HttpContext context) {
HttpPostedFile _upfile = context.Request.Files["File1"];
if (_upfile == null)
{
ResponseWriteEnd(context, "");//请选择要上传的文件
}
else
{
string fileName = _upfile.FileName;/*获取文件名: C:\Documents and Settings\Administrator\桌面\123.jpg*/
string suffix = fileName.Substring(fileName.LastIndexOf(".") + ).ToLower();/*获取后缀名并转为小写: jpg*/
int bytes = _upfile.ContentLength;//获取文件的字节大小 if (suffix != "jpg")
ResponseWriteEnd(context, ""); //只能上传JPG格式图片
if (bytes > * )
ResponseWriteEnd(context, ""); //图片不能大于1M _upfile.SaveAs(HttpContext.Current.Server.MapPath("~/images/logo.jpg"));//保存图片
ResponseWriteEnd(context, ""); //上传成功
}
} private void ResponseWriteEnd(HttpContext context, string msg)
{
context.Response.Write(msg);
context.Response.End();
} public bool IsReusable {
get {
return false;
}
}
}
可以按照自己的需求来修改,希望对您有帮助!
ajax+jquery+ashx如何实现上传文件的更多相关文章
- Django学习——ajax发送其他请求、上传文件(ajax和form两种方式)、ajax上传json格式、 Django内置序列化(了解)、分页器的使用
1 ajax发送其他请求 1 写在form表单 submit和button会触发提交 <form action=""> </form> 注释 2 使用inp ...
- 【转】JQuery插件ajaxFileUpload 异步上传文件(PHP版)
前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错,但是由于手机不支持flash,所以不得不再找一个文件上传插件来用了.后来发现a ...
- JQuery插件ajaxFileUpload 异步上传文件(PHP版)
太久没写博客了,真的是太忙了.善于总结,进步才会更快啊.不多说,直接进入主题. 前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错 ...
- ajax上传文件 基于jquery form表单上传文件
<script src="/static/js/jquery.js"></script><script> $("#reg-btn&qu ...
- 利用jquery.form实现异步上传文件
实现原理 目前需要在一个页面实现多个地方调用上传控件上传文件,并且必须是异步上传.思考半天,想到通过创建动态表单包裹上传文件域,利用jquery.form实现异步提交表单,从而达到异步上传的目的,在上 ...
- (H5)FormData+AJAX+SpringMVC跨域异步上传文件
最近都没时间整理资料了,一入职就要弄懂业务,整天被业务弄得血崩. 总结下今天弄了一个早上的跨域异步上传文件.主要用到技术有HTML5的FormData,AJAX,Spring MVC. 首先看下上传页 ...
- 关于JQuery.form.js异步上传文件点滴
好久没动代码了,前几天朋友委托我帮忙给做几个页面,其中有个注册带图片上传的页面.已之前的经验应该很快就能搞定,没想到的是搞了前后近一天时间.下面就说说异步上传的重要几个点,希望自己下次遇到此类问题的时 ...
- JQuery插件ajaxFileUpload 异步上传文件
一.先对ajaxFileUpload插件的语法参数进行讲解 原理:ajaxfileupload是通过监听iframe的onload方法来实现, 当从服务端处理完成后,就触发iframe的onload事 ...
- jquery.form.js mvc 上传文件 layer 选择框与等待效果
HTML <form role="form" id="form1"> <div class="form-group"> ...
随机推荐
- Mobile data
1.Consume REST web services from app 2.De-serialize JSON into an in-memory object collection 3.Save ...
- 【android异步处理】一个关于android异步处理的文章系列
最近读了Android异步处理系列文章索引,感觉这个文章系列写得不错!可以作为参考
- Listener监听器使用小案例
这里介绍的就是一个客户流失监听器案例 新建一个监听器实现ServletContextListener接口 覆写contextDestroyed和contextInitialized 方法 packag ...
- *HDU 1286,2824欧拉函数
#include<iostream> #include<string> #include<cstdio> #include<cmath> #includ ...
- ajaxfileupload.js
jQuery.extend({ createUploadIframe: function(id, uri) { //create frame var frameId = 'jUploadFrame' ...
- 二叉树-二叉查找树-AVL树-遍历
一.二叉树 定义:每个节点都不能有多于两个的儿子的树. 二叉树节点声明: struct treeNode { elementType element; treeNode * left; treeNod ...
- 中介者模式(Mediator)
GOF:用一个中介对象来封装一系列的对象交互.中介者使对象不需要显式地相互引用,从而使其耦合松散,而且可以独立地改变它们之间的交互. 类图:
- javascript:算法之数组去重
一 /*******************************111111111***********************************/ /*1,最好数组去重方法,利用json的 ...
- phpqrcode不能输出二维码
phpqrcode不能输出二维码 注意 权限..... 注意 扩展 header('Content-Type: image/png'); include_once 'phpqrcode/qrlib ...
- flush vs ob_flush
刷新PHP程序的缓冲,而不论PHP执行在何种情况下(CGI ,web服务器等等).该函数将当前为止程序的所有输出发送到用户的浏览器. flush() 函数不会对服务器或客户端浏览器的缓存模式产生影响. ...