Jquery-uploadify多文件上传插件使用起来非常的给力,在此记录一下使用方法。

query-uploadify插件的属性设置

<script src="JS/jquery.min.js" type="text/javascript"></script><script src="JS/jquery.uploadify/jquery.uploadify.min.js" type="text/javascript"></script><script type="text/javascript">
$(function () {
$("#uploadify").uploadify({
'swf': '/JS/jquery.uploadify/uploadify.swf',//flash地址
'uploader': 'UploadHandler.ashx',//后台处理程序
'buttonImage': '/img/bgimg.jpg',//按钮图片
'auto': true,//选中后是否自动上传
'multi': true,//是否可以多文件上传
'queueID': 'fileQueue',//成功后列表追加对象
'width': 157,
'height': 45,
'fileSizeLimit': '50MB',//文件大小限制
'fileTypeExts': '*.docx;*.doc;*.ppt;*.pptx;*.pdf;*.caj;*.txt;*.rar;*.zip;*.jpg;*.gif;',//格式限制
'fileTypeDesc:': '请选择docx doc ppt pptx pdf caj txt rar zip jpg gif文件',//格式提示
'progressData': 'all',//进度显示样式
'removeCompleted': false,//是否移除队列
'overrideEvents': ['onSelectError', 'onDialogClose'],//重写事件
//返回一个错误,选择文件的时候触发
'onSelectError': function (file, errorCode, errorMsg) {
switch (errorCode) {
case -100:
alert("上传的文件数量已经超出系统限制的" + $('#uploadify').uploadify('settings', 'queueSizeLimit') + "个文件!");
break;
case -110:
alert("文件 [" + file.name + "] 大小超出系统限制的" + $('#uploadify').uploadify('settings', 'fileSizeLimit') + "大小!");
break;
case -120:
alert("文件 [" + file.name + "] 大小异常!");
break;
case -130:
alert("文件 [" + file.name + "] 类型不正确!");
break;
}
return true;
},
//检测FLASH失败调用
'onFallback': function () {
alert("您未安装FLASH控件,无法上传图片!请安装FLASH控件后再试。");
} });
}); </script>
<!--Jquery-uploadify调用-->
<body>
<p>
<a href="javascript:$('#uploadify').uploadifyUpload()">上传</a>|
<a href="javascript:$('#uploadify').uploadifyClearQueue()">取消上传</a>
</p>
<input type="file" name="uploadify" id="uploadify" />
<div id="fileQueue" style=""></div>
</body>

处理文件UploadHandler.ashx.cs代码

较为基本的处理程序,接收uploadify文件数据进行处理保存。

/// <summary>
/// $codebehindclassname$ 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] public class UploadHandler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
context.Response.Charset = "utf-8"; HttpPostedFile file = context.Request.Files["Filedata"];
string uploadPath =
HttpContext.Current.Server.MapPath(@context.Request["folder"])+"\\"; if (file != null)
{
if (!Directory.Exists(uploadPath))
{
Directory.CreateDirectory(uploadPath);
}
file.SaveAs(uploadPath + file.FileName);
//下面这句代码缺少的话,上传成功后上传队列的显示不会自动消失
context.Response.Write("");
}
else
{
context.Response.Write("");
}
} public bool IsReusable
{
get
{
return false;
}
}
}

uploaddify相关链接

Jquery-uploadify多文件上传插件使用介绍的更多相关文章

  1. Uploadify多文件上传插件.NET使用案例+PHP使用案例

    ploadify是一个非常好用的多文件上传插件 插件下载:http://www.uploadify.com 下载后需要用到的文件: 接下来就是直接添加代码: Default.aspx代码 <%@ ...

  2. FCKeditor插件开发实例:uploadify多文件上传插件

    FCKeditor是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器.它志于轻量化,不需要太复杂的安装步骤即可使用.它可和PHP.JavaScript.ASP.ASP.NET.ColdFusi ...

  3. Jquery Uploadify多文件上传实例

    jQuery Uploadify开发使用的语言是java. 详细的相关文档,可以参考官网的doc:http://www.uploadify.com/documentation/ 官网的讲解还是很详细的 ...

  4. jQuery File Upload 文件上传插件使用一 (最小安装 基本版)

    jQuery File Upload 是一款非常强大的文件上传处理插件,支持多文件上传,拖拽上传,进度条,文件验证及图片音视频预览,跨域上传等等. 可以说你能想到的功能它都有.你没想到的功能它也有.. ...

  5. jQuery File Upload文件上传插件简单使用

    前言 开发过程中有时候需要用户在前段上传图片信息,我们通常可以使用form标签设置enctype=”multipart/form-data” 属性上传图片,当我们点击submit按钮的时候,图片信息就 ...

  6. jQuery File Upload 文件上传插件使用二 (功能完善)

    使用Bootstrap美化进度条 Bootstrap现在几乎是人尽皆知了,根据它提供的进度条组件, 让进度条显得高大尚点 正因为其功能强大,js模块文件之间牵连较深 不好的地方耦合度非常高 重要的参数 ...

  7. jquery file upload 文件上传插件

    1. jquery file upload 下载 jquery file upload Demo 地址:https://blueimp.github.io/jQuery-File-Upload/ jq ...

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

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

  9. jQuery文件上传插件Uploadify(转)

    一款基于flash的文件上传,有进度条和支持大文件上传,且可以多文件上传队列. 这款在flash的基础上增加了html5的支持,所以在移动端也可以使用. 由于官方提供的版本是flash免费,html5 ...

随机推荐

  1. MongoDB数据库导出导入迁移

    在server 1导出 /usr/local/mongodb/bin/mongorestore -d adv_new /tmp/mongodb/ 然后会在/tmp/mongodb/目录下生成一个adv ...

  2. grep和正则表达式

    正则表达式示例表字 符 意 义 示 例* 任意长度的字符串. a* 表示: 空字符串.aaaa.a…? 长度为0或者1的字符串. a? 表示: 空字符串和a.+ 长度为一个或者多个的字符串. a+表示 ...

  3. IO流+数据库课后习题

    1,读取 试题文件 然后做题算分 File file1=new File("D:\\file","test.txt"); try{ FileReader in1 ...

  4. QML之窗口(无边框、透明及拖拽)

    1.无边框 Qt Quick 2.0 中 QQuickView代替了1.0中的QDeclarativeView. 无边框窗口代码如下: QQuickView viwer; //QQuickView继承 ...

  5. 函数递归时,递归次数到900多时,就是抛出异常exception RuntimeError('maximum recursion depth exceeded',)

    import subprocess import multiprocessing import urllib import sys import os import pymongo import si ...

  6. 【创建型】Abstract Factory模式 & Factory Method模式

    本文主要介绍简单工厂模式与抽象工厂模式.以下如有叙述不当之处,欢迎批评指正,欢迎交流探讨. 一:简单工厂模式 在23种设计模式中,简单工厂模式其实是不在列的,但理解该模式对于抽象工厂模式的思想理解是有 ...

  7. static变量的使用

    静态变量 类型说明符是static. 静态变量属于静态存储方式,其存储空间为内存中的静态数据区(在静态存储区内分配存储单元),该区域中的数据在整个程序的运行期间一直占用这些存储空间(在程序整个运行期间 ...

  8. Django新手图文教程

    Django新手图文教程 本文面向:有python基础,刚接触web框架的初学者. 环境:windows7   python3.5.1  pycharm专业版  Django 1.10版 pip3 一 ...

  9. UIImagePickerController 操作图库

     UIImagePickerController详解   转载自:http://blog.csdn.net/kingsley_cxz/article/details/9157093 1.UIImage ...

  10. data-theme 几种值的样式

    代码片段: <div data-role="page"> <div data-role="header"> <h1>The ...