jquery file upload + asp.net 异步多文件上传
<!DOCTYPE HTML>
<html lang="en">
<head>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="css/jquery.fileupload.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="js/vendor/jquery.ui.widget.js"></script>
<script src="js/jquery.iframe-transport.js"></script>
<script src="js/jquery.fileupload.js"></script>
<script src="js/jquery.fileupload-process.js"></script>
<script src="js/jquery.fileupload-validate.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(function () {
var url = '/Handler1.ashx?folder=/File/';
$('#fileupload').fileupload({
url: url,
dataType: 'json',
//如果有格式需求，可把里面 的 gif|jpe?g|png 替换成相应格式的文件
acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i
}).on('fileuploaddone', function (e, data) {
//成功：handler中返回 json对象
//这里的 result 为你再handler中 返回的 json对象
alert(data.result.name);
}).on('fileuploadfail', function (e, data) {
//失败： 如果handler没有 返回 对象，则 会执行 这个 函数
var file = data.files[0];
alert(file.name);
}).on('fileuploadprocessalways', function (e, data) {
//格式判断
//1.引用上面的paocess.js validate.js
//2.如果格式不正确，执行该函数
var index = data.index, file = data.files[index];
if (file.error) {
alert(file.name);
alert(file.error); //error信息在 validate.js中，可以自己修改
}
});
})
</script>
</head>
<body>
<pre>
1.input控件如果 不加 multiple属性，则为单文件上传
2.bootstrap.min.css bootstrap.min.js
这个样式 是bootstrap的样式，如果有需求再引用，主要是为了好看
3.详细的返回方法见代码里面
</pre>
<span class="btn btn-success fileinput-button"><i class="glyphicon glyphicon-plus"></i>
<span>Select files...</span>
<input id="fileupload" type="file" name="files[]" multiple="multiple">
</span>
<div id="files" class="files">
</div>
</body>
</html>
handler
using System.IO;
using System.Web;
namespace NmsWebJQueryFileUpload
{
/// <summary>
/// Handler1 的摘要说明
/// </summary>
public class Handler1 : IHttpHandler
{
public bool IsReusable
{
get
{
return false;
}
}
public void ProcessRequest(HttpContext context)
{
HttpPostedFile uploadedfile = context.Request.Files[0];
string FileName = uploadedfile.FileName;
string FileType = uploadedfile.ContentType;
int FileSize = uploadedfile.ContentLength;
FileInfo info = new FileInfo(FileName);
string folderFullPath = context.Server.MapPath(context.Request["folder"]);
if (!Directory.Exists(folderFullPath))
{
Directory.CreateDirectory(folderFullPath);
}
uploadedfile.SaveAs(folderFullPath + "\\" + info.Name);
context.Response.ContentType = "text/plain";
//重点这里一定要返回 一个 对象。否则 html页面会认为请求错误的
context.Response.Write("{\"name\":\"" + info.Name + "\",\"url\":\"" + FileType + "\",\"size\":\"" + FileSize + "\"}");
}
}
}
jquery file upload + asp.net 异步多文件上传的更多相关文章
- 定制jQuery File Upload为微博式单文件上传
日志未经声明,均为AlloVince原创.版权采用『 知识共享署名-非商业性使用 2.5 许可协议』进行许可. jQuery File Upload是一个非常优秀的上传组件,主要使用了XHR作为上传方 ...
- jquery ajax file upload NET MVC 无刷新文件上传
网上有各种各样的文件上传方法,有基于JS框架的.也有基于flash swf插件的. 这次分享一个比较简单而且实用能快速上手的文件上传方法,主要步骤: 1.引用Jquery包,我用的是jquery-1. ...
- blueImp/jQuery file upload 的正确用法（限制上传大小和文件类型）
这个插件太出名了,几乎能完成所有能想象的到的效果,包括进度条.拖拽.甚至现在已经完美支持图片视频等的处理,三个字形容就是屌爆了.最近在做上传这一部分,发现网上对于上传文件大小的限制和类型检测等的方法都 ...
- Asp.net mvc 大文件上传 断点续传
Asp.net mvc 大文件上传 断点续传 进度条 概述 项目中需要一个上传200M-500M的文件大小的功能,需要断点续传.上传性能稳定.突破asp.net上传限制.一开始看到51CTO上的这 ...
- MVC图片上传、浏览、删除 ASP.NET MVC之文件上传【一】（八） ASP.NET MVC 图片上传到服务器
MVC图片上传.浏览.删除 1.存储配置信息 在web.config中,添加配置信息节点 <appSettings> <add key="UploadPath" ...
- iOS开发之结合asp.net webservice实现文件上传下载
iOS开发中会经常用到文件上传下载的功能,这篇文件将介绍一下使用asp.net webservice实现文件上传下载. 首先,让我们看下文件下载. 这里我们下载cnblogs上的一个zip文件.使用N ...
- ASP.NET中的文件上传大小限制的问题
一.文件大小限制的问题 首先我们来说一下如何解决ASP.NET中的文件上传大小限制的问题,我们知道在默认情况下ASP.NET的文件上传大小限制为2M,一般情况下,我们可以采用更改WEB.Config文 ...
- jquery插件课程2 放大镜、多文件上传和在线编辑器插件如何使用
jquery插件课程2 放大镜.多文件上传和在线编辑器插件如何使用 一.总结 一句话总结:插件使用真的还是比较简单的,引包,初始化,配置参数(json),配置数据(json),而后两步不是必须的.而且 ...
- Asp.net mvc 大文件上传 断点续传 进度条
概述 项目中需要一个上传200M-500M的文件大小的功能,需要断点续传.上传性能稳定.突破asp.net上传限制.一开始看到51CTO上的这篇文章,此方法确实很不错,能够稳定的上传大文件,http: ...
随机推荐
- hdu4325 线段树 成段更新
#include<stdio.h> #include<string.h> #include<algorithm> using namespace std; #def ...
- git 403
MacBook-Pro:~ easy$ git pull fatal: unable to access 'https://git.xx.com:40443/source/projectName/': ...
- @codeforces - 1086F@ Forest Fires
目录 @description@ @solution@ @accepted code@ @details@ @description@ 一个无穷大的方格图,每个方格内都种了棵树. 一开始点燃了 n 棵 ...
- React Native中pointerEvent属性
在React Native界面开发中, 如果使用绝对定位布局,在代码运行时的某个时刻有可能会遮盖住它的下方的某个组件.这是因为绝对定位只是说这个组件的位置由它父组件的边框决定. 绝对定位的组件可以被认 ...
- iOS学习--详解UIView的 contentStretch属性
通过实例和图片理解UIView的contentStretch属性 方法 通过一个图片建立一个简单的UIImageView 设置它的contentStretch属性 修改它的frame属性 观察 测试用 ...
- 阿里云CDN技术掌舵人文景：相爱相杀一路狂奔的这十年
导读:提到阿里云CDN,不得不提技术掌舵人姚伟斌(文景),虽然他不是团队中最“老”的同学,但他却历经了淘宝业务发展最为飞速的几年,见证了从最初服务淘宝和集团内部的CDN,到如今国内服务客户最多的云CD ...
- 从 SGD 到 Adam —— 深度学习优化算法概览(一) 重点
https://zhuanlan.zhihu.com/p/32626442 骆梁宸 paper插画师:poster设计师:oral slides制作人 445 人赞同了该文章 楔子 前些日在写计算数学 ...
- POJ3080 Blue Jeans 题解 KMP算法
题目链接:http://poj.org/problem?id=3080 题目大意:给你N个长度为60的字符串(N<=10),求他们的最长公共子串(长度>=3). 题目分析:KMP字符串匹配 ...
- 使用提示(Hints)
对于表的访问,可以使用两种Hints. FULL 和 ROWID FULL hint 告诉ORACLE使用全表扫描的方式访问指定表. 例如: SELECT /*+ FULL(EMP) */ * FRO ...
- cmd导入比较大的sql脚本
osql -S jack_c -d yourdb -U sa -P 123 -i E:\user.sql 注意: sql脚本里面一定要先创建数据库或者use到某个数据库,然后再cmd执行脚本