ajaxfileupload异步上传文件
ajaxfileupload插件可以以异步方式上传文件(其实现:iframe),不像传统那样需要刷新,下面就介绍下其使用
1、HTML部分(先引入jquery):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>无刷新单文件上传</title>
<script src="jquery-2.2.4.min.js"></script>
<script src="ajaxfileupload.js"></script>
</head>
<body>
<p style="display:none"><input type="file" id="file1" name="file" /></p>
<input type="button" value="上传" /> <script type="text/javascript">
$(function () {
$(":button").click(function () {
$("#file1").click();
})
})
$(document).on("change", "#file1", function () {
$.ajaxFileUpload({
url: '/upload.ashx', //用于文件上传的服务器端请求地址
secureuri: false, //一般设置为false
fileElementId: 'file1', //文件上传空间的id属性 <input type="file" id="file" name="file" />
dataType: 'json', //返回值类型 一般设置为json
success: function (data, status) //服务器成功响应处理函数
{
if (typeof (data.error) != 'undefined') {
if (data.error != '') {
alert(data.error);
} else {
alert(data.msg);
}
}
},
error: function (data, status, e)//服务器响应失败处理函数
{
alert(e);
}
})
});
</script>
</body>
</html>
2、后台代码(使用的一般处理程序[ashx]):
public class upload : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
HttpFileCollection files = context.Request.Files;
string msg = string.Empty;
string error = string.Empty;
string imgurl;
if (files.Count > )
{
files[].SaveAs(context.Server.MapPath("/") + System.IO.Path.GetFileName(files[].FileName));
msg = " 成功! 文件大小为:" + files[].ContentLength;
imgurl = "/" + files[].FileName;
string res = "{ error:'" + error + "', msg:'" + msg + "',imgurl:'" + imgurl + "'}";
context.Response.Write(res);
context.Response.End();
}
} public bool IsReusable
{
get
{
return false;
}
}
}
注意:IE低版本可能会不兼容(上传文件框被隐藏,而是通过点击按钮去模拟触发文件框点击事件)
参考:http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html
ajaxfileupload异步上传文件的更多相关文章
- 【转】JQuery插件ajaxFileUpload 异步上传文件(PHP版)
前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错,但是由于手机不支持flash,所以不得不再找一个文件上传插件来用了.后来发现a ...
- JQuery插件ajaxFileUpload 异步上传文件(PHP版)
太久没写博客了,真的是太忙了.善于总结,进步才会更快啊.不多说,直接进入主题. 前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错 ...
- struts2 jquery ajaxFileUpload 异步上传文件
网上搜集的,整理一下. 一.ajaxFileUpload 实现异步上传文件利用到了ajaxFileUpload.js这个文件,这是别人开发的一个jquery的插件,可以实现文件的上传并能够和strut ...
- jquery ajaxFileUpload异步上传文件
ajaxFileUpload.js 很多同名的,因为做出来一个很容易. 我用的是这个:https://github.com/carlcarl/AjaxFileUpload 下载地址在这里:http:/ ...
- JQuery插件ajaxFileUpload 异步上传文件
一.先对ajaxFileUpload插件的语法参数进行讲解 原理:ajaxfileupload是通过监听iframe的onload方法来实现, 当从服务端处理完成后,就触发iframe的onload事 ...
- 利用ajaxfileupload.js异步上传文件
1.引入ajaxfileupload.js 2.html代码 <input type="file" id="enclosure" name="e ...
- 异步上传文件,ajax上传文件,jQuery插件之ajaxFileUpload
http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 一.ajaxFileUpload是一个异步上传文件的jQuery插件. ...
- jQuery插件之ajaxFileUpload异步上传
介绍 AjaxFileUpload.js 是一个异步上传文件的jQuery插件,原理是创建隐藏的表单和iframe然后用JS去提交,获得返回值. 下载地址: http://files.cnblogs. ...
- Servlet异步上传文件
这里需要用到插件ajaxfileupload.js,jar包:commons-fileupload-1.3.2.jar,commons-io-2.5.jar 注意红色部分的字!!!! 1.创建一个we ...
随机推荐
- JAVA第八周课堂笔记
- 一个台阶总共有n级,如果一次可以跳1级,也可以跳2级。求总共有 多少总跳法?
首先我们考虑最简单的情况:如果只有1 级台阶,那显然只有一种跳法,如果有2 级台阶,那就有两种跳的方法了:一种是分两次跳,每次跳1 级:另外一种就是一次跳2 级.现在我们再来讨论一般情况:我们把n 级 ...
- (转)部署MongoDB时需要注意的调参
部署MongoDB的生产服务器,给出如下相关建议: 使用虚拟化环境: 系统配置 1)推荐RAID配置 RAID(Redundant Array of Independent Disk,独立磁盘冗余阵列 ...
- DataBase -- Customers Who Never Order
Question: Suppose that a website contains two tables, the Customers table and the Orders table. Writ ...
- 【转】C#获取当前路径7种方法
webformvar s = System.Diagnostics.Process.GetCurrentProcess().MainModule.FileName; //C盘 IIS路径 var s1 ...
- cf 442 D. Olya and Energy Drinks
cf 442 D. Olya and Energy Drinks(bfs) 题意: 给一张\(n \times m(n <= 1000,m <= 1000)\)的地图 给出一个起点和终点, ...
- POJ3294 Life Forms 【后缀数组】
生命形式 时间限制: 5000MS 内存限制: 65536K 提交总数: 16660 接受: 4910 描述 你可能想知道为什么大多数外星人的生命形式与人类相似,不同的是表面特征,如身高,肤色 ...
- 洛谷 P3084 [USACO13OPEN]照片Photo 解题报告
[USACO13OPEN]照片Photo 题目描述 农夫约翰决定给站在一条线上的\(N(1 \le N \le 200,000)\)头奶牛制作一张全家福照片,\(N\)头奶牛编号\(1\)到\(N\) ...
- 安徽师大附中%你赛day4T2 演讲解题报告
演讲 题目背景: 众所周知,\(\mathrm{Zdrcl}\)是一名天天\(\mathrm{AK}\)的高水平选手. 作为一民长者,为了向大家讲述自己\(\mathrm{AK}\)的经验,他决定在一 ...
- 【BZOJ 1082】[SCOI2005]栅栏 二分+dfs
对于最优解我们发现所有的最优解都可以是前多少多少个,那么我们就二分这个前多少多少个,然后用dfs去判解,我们发现在dfs的过程中如果不剪枝几乎必T,所以我们就需要一些有效的剪枝 I. 我们在枚举过程中 ...