最近想做一个上传的总结,把自己用过的上传插件都写一写,哪天用到的时候就不用再一次的翻阅资料,现在页面上用到的上传插件,原理上都差不多,那我也就不再废话了,下面我主要记录一下几个比较常用的,由简到繁,这里我只写代码,其它的就不在啰嗦了:

  • 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的更多相关文章

  1. JQuery文件上传插件JQuery.upload.js的用法简介

    JQuery文件上传插件,这个插件很小,用法很简单,效果却很棒.注意:JQuery版本要求1.8及以上,大家执行如果没效果,则检查JQuery版本,如果是1.8及以上,则该插件源码中的.size()需 ...

  2. jQuery文件上传插件jQuery Upload File 有上传进度条

    jQuery文件上传插件jQuery Upload File 有上传进度条 jQuery文件上传插件jQuery Upload File,插件使用简单,支持单文件和多文件上传,支持文件拖拽上传,有进度 ...

  3. 上传系列:ajaxupload.js

    ajaxupload.js 上次说了jquery.upload.js,这次再说一下ajaxupload.js,这个其实也比较简答,只有一个JS文件: html代码: $(function () { v ...

  4. 文件上传时jquery.form.js中提示form.submit SCRIPT5: 拒绝访问

    利用其它控件触发file的click事件来选择文件后,使用jquery.form.js中的submit方法提交时IE报错:form.submit SCRIPT5: 拒绝访问,其它浏览器正常, < ...

  5. 图片裁剪上传插件——jquery.photoClip.js

    想要裁剪图片上传: 需要依赖的的插件为: [jquery.photoClip.js] 插件[iscroll-zoom.js] 插件[hammer.js] 插件 [lrz.all.bundle.js] ...

  6. 图片上传(方法一:jquery.upload.js)

    一.在JSP页面引入jquery.upload.js 文件: <script type="text/javascript" src="${ctx}/script/j ...

  7. 基于 jq 实现拖拽上传 APK 文件,js解析 APK 信息

    技术栈 jquery 文件上传:jquery.fileupload,github 文档 apk 文件解析:app-info-parser,github 文档 参考:前端解析ipa.apk安装包信息 - ...

  8. 强大的支持多文件上传的jQuery文件上传插件Uploadify

    支持多文件上传的jQuery文件上传插件Uploadify,目前此插件有两种版本即Flash版本和HTML5版本,对于HTML5版本会比较好的支持手机浏览器,避免苹果手机Safari浏览器不支持Fla ...

  9. PHP 多图上传,图片批量上传插件,webuploader.js,百度文件上传插件

    PHP  多图上传,图片批量上传插件,webuploader.js,百度文件上传插件(案例教程) WebUploader作用:http://fex.baidu.com/webuploader/gett ...

随机推荐

  1. HDU 4461 The Power of Xiangqi (水题)

    题意:给定一些字母,每个字母都代表一值,如果字母中没有B,或者C,那么就在总值大于1的条件下删除1,然后比较大小. 析:没什么好说的,加起来比较就好了. 代码如下: #pragma comment(l ...

  2. 语义Web和本体开发相关技术

    在技术实现方面,语义Web和本体理论的研究日趋成熟,已经有许多成熟的工具或程序接口,诸如Jena.OWL API等API是系统实现的关键技术.这里介绍系统的可行性分析以及系统开发设计的关键技术. 1 ...

  3. STM32实验非正式报告之DMA

    前言 DMA即直接内存存取.我理解它就是一个“交通部长”抑或是一个“搬运工”,协助CPU存储或读取数据.既然它的主要工作就是“搬运”数据,服务对象自然就是内存(不太严格的说法吧,STM32中Flash ...

  4. c++未指定返回值

    int foo() { } foo返回的是随机数 函数的返回值在函数堆栈的参数后面,由一个指向寄存器的指针决定,函数返回时,调用者取指针取寄存器中的值作为返回值. 如果指定返回值,函数在返回前会将返回 ...

  5. log_bin_trust_function_creators错误解决

    log_bin_trust_function_creators错误解决   当有mysql本地或远程建立function或procedure时报上面的错误  经试验是log_bin_trust_fun ...

  6. oracle安装界面中文乱码解决

    在安装oracle时如果我们用的是英文安装没有任何问题,但是我要安装中文的,结果中文界面就出现了乱码了,后来网上找了原因是要安装中文包才可以,下面我来介绍一下. 在Linux的X window里安装o ...

  7. SQL性能优化工具TKPROF

     全名为Trace Kernel Profile,用来格式化跟踪文件,是一个命令行工具. 主要的格式例如以下: tkprof tracefile outputfile - tracefile:要分 ...

  8. iOS开发——数据持久化&本地数据的存储(使用NSCoder将对象保存到.plist文件)

    本地数据的存储(使用NSCoder将对象保存到.plist文件)   下面通过一个例子将联系人数据保存到沙盒的“documents”目录中.(联系人是一个数组集合,内部为自定义对象).   功能如下: ...

  9. python基础(5):深入理解 python 中的赋值、引用、拷贝、作用域

    http://my.oschina.net/leejun2005/blog/145911 http://www.cnblogs.com/lulipro/p/5060163.html http://ww ...

  10. Qt Quick实现的疯狂算数游戏

    使用 Qt Quick 写了个小游戏:疯狂算数.支持 Windows 和 Android 两个平台. 游戏简单,但牵涉到下面你的 Qt Quick 主题: 自己实现一个按钮 自适应分辨率 国际化 QM ...