上传系列:jquery.upload.js
最近想做一个上传的总结,把自己用过的上传插件都写一写,哪天用到的时候就不用再一次的翻阅资料,现在页面上用到的上传插件,原理上都差不多,那我也就不再废话了,下面我主要记录一下几个比较常用的,由简到繁,这里我只写代码,其它的就不在啰嗦了:
- jquery.upload.js
- ajaxupload.js
- uploadify
- SWFUpload
jquery.upload.js
这里只写主要的,至于js的引用我就不用说了是吧,自己添加上就行,我就不写了。
前台html代码:
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title></title>
<script>
/*文件上传*/
function upload() {
$.upload({ // 上传方法
url: '/System/Upload', // 上传地址
fileName: 'uploadfile', // 文件域名字
params: { name: 'pxblog' }, // 其他表单数据
dataType: 'json', // 上传完成后, 返回json, text
onSend: function () { // 上传之前回调,return true表示可继续上传
return true;
},
onSubmit: function () {
},
onComplate: function (data) { // 上传之后回调
if (data.msg) { } else {
alert("上传图片出错!");
}
}
})
}
</script>
</head>
<body>
<div>
<input type="button" onclick="upload()" value="点击上传" />
</div>
</body>
</html>
后台接收文件的代码,这里用的MVC
public ActionResult Upload(HttpPostedFileBase FileData)
{
// 如果没有上传文件
if (FileData == null || string.IsNullOrEmpty(FileData.FileName) || FileData.ContentLength == )
{
return this.HttpNotFound();
}
string filename = Path.GetFileName(FileData.FileName); //获得文件名
string extension = Path.GetExtension(FileData.FileName);//获得文件扩展名
string phyPath = Request.MapPath("/Upload/");
if (!Directory.Exists(phyPath))
{
Directory.CreateDirectory(phyPath);
}
decimal newid = Math.Abs(Guid.NewGuid().GetHashCode());
string filepath = phyPath + newid + extension;
FileData.SaveAs(filepath);
return Content(newid + extension);
}
缺点:
这种方式,有个缺点,而且还是在IE上,想想就郁闷,很多乱七八糟的问题都出现在IE上,微软咋就不能好好整整IE啊。
如果咱们返回方式选择json的时候,IE有的版本会弹框提示下载,哎,遇到这种问题,也真是够倒霉的,没办法,自求多福吧
上传系列:jquery.upload.js的更多相关文章
- JQuery文件上传插件JQuery.upload.js的用法简介
JQuery文件上传插件,这个插件很小,用法很简单,效果却很棒.注意:JQuery版本要求1.8及以上,大家执行如果没效果,则检查JQuery版本,如果是1.8及以上,则该插件源码中的.size()需 ...
- jQuery文件上传插件jQuery Upload File 有上传进度条
jQuery文件上传插件jQuery Upload File 有上传进度条 jQuery文件上传插件jQuery Upload File,插件使用简单,支持单文件和多文件上传,支持文件拖拽上传,有进度 ...
- 上传系列:ajaxupload.js
ajaxupload.js 上次说了jquery.upload.js,这次再说一下ajaxupload.js,这个其实也比较简答,只有一个JS文件: html代码: $(function () { v ...
- 文件上传时jquery.form.js中提示form.submit SCRIPT5: 拒绝访问
利用其它控件触发file的click事件来选择文件后,使用jquery.form.js中的submit方法提交时IE报错:form.submit SCRIPT5: 拒绝访问,其它浏览器正常, < ...
- 图片裁剪上传插件——jquery.photoClip.js
想要裁剪图片上传: 需要依赖的的插件为: [jquery.photoClip.js] 插件[iscroll-zoom.js] 插件[hammer.js] 插件 [lrz.all.bundle.js] ...
- 图片上传(方法一:jquery.upload.js)
一.在JSP页面引入jquery.upload.js 文件: <script type="text/javascript" src="${ctx}/script/j ...
- 基于 jq 实现拖拽上传 APK 文件,js解析 APK 信息
技术栈 jquery 文件上传:jquery.fileupload,github 文档 apk 文件解析:app-info-parser,github 文档 参考:前端解析ipa.apk安装包信息 - ...
- 强大的支持多文件上传的jQuery文件上传插件Uploadify
支持多文件上传的jQuery文件上传插件Uploadify,目前此插件有两种版本即Flash版本和HTML5版本,对于HTML5版本会比较好的支持手机浏览器,避免苹果手机Safari浏览器不支持Fla ...
- PHP 多图上传,图片批量上传插件,webuploader.js,百度文件上传插件
PHP 多图上传,图片批量上传插件,webuploader.js,百度文件上传插件(案例教程) WebUploader作用:http://fex.baidu.com/webuploader/gett ...
随机推荐
- 启动报错:java.lang.ClassNotFoundException: org.springframework.web.context.ContextLoaderListener
如果你是maven项目,tomcat在发布项目的时候没有同时发布maven依赖所添加的jar包,你需要设置一下eclipse:项目 —> 属性 -> Deployment Assembly ...
- Ioc容器Autofac系列(3)-- 三种注册组件的方式
简单来说,所谓注册组件,就是注册类并映射为接口,然后根据接口获取对应类,Autofac将被注册的类称为组件. 虽然可像上篇提到的一次性注册程序集中所有类,但AutoFac使用最多的还是单个注册.这种注 ...
- NHibernate - ICriteria 查询
http://blog.knowsky.com/213234.htm http://blog.chinaunix.net/uid-20463341-id-1673509.html http://www ...
- C++ 内存相关
1.C++的内存管理可分为以下几个部分: 栈:记录程序的执行过程. 堆:采用new,delete申请释放内存. 自由存储区:对应于C中使用malloc,free申请释放内存. 全局存储区:也叫静态存储 ...
- 【M20】协助完成“返回值优化(RVO)”
1.方法返回对象,会导致临时对象的产生,这降低了效率,const Rational operator* (const Rational& lhs,Rational& rhs).有没有什 ...
- Codeforces Round #332 (Div. 2) B. Spongebob and Joke 水题
B. Spongebob and Joke Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/599 ...
- Codeforces Gym 100637G G. #TheDress 暴力
G. #TheDress Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/gym/100637/problem/G ...
- hive-0.10.0-cdh4.3.0安装
1.我使用的Hadoop2.0-cdh4.3.0,相应hive配套版本号hive-0.10.0-cdh4.3.0. 2.改动hive/conf下hive-site.xml文件,无则创建hive- ...
- mybatis0211 mybatis和spring整合
1mybatis和spring整合 1.1 mybaits和spring整合的思路 .让spring管理SqlSessionFactory .让spring管理mapper动态代理对象和dao. 使用 ...
- 错误解决:release' is unavailable: not available in automatic reference counting mode
解决办法: You need to turn off Automatic Reference Counting. You do this by clicking on your project in ...