一、前端搭建

1、前端用到js:uploadify(下载地址:http://www.uploadify.com/download/)、layer (下载地址:http://layer.layui.com/),下载之后把它们放在你的项目里 列如

    

  2、根据你的需要在你项目适当的位置建立上传文件的目录  列如(File)

到此前端搭建结束

二、配置文件修改(可选择跳过此步骤)

  1、首先说明下,这个步骤可以跳过,此步骤主要是修改上传文件大小的限制(.net 默认最大只能上传4M)如若需要修改请继续阅读该步骤。

  2、打开web.config 配置文件 找到<system.web> 节点 ,在该节点下面添加如下节点

        <httpRuntime targetFramework="4.5"   executionTimeout="500" maxRequestLength="409600" useFullyQualifiedRedirectUrl="false" minFreeThreads="8" minLocalRequestFreeThreads="4" appRequestQueueLimit="100" />

       <!-- maxRequestLength属性是上传文件大小的设置 值是kb大小  maxRequestLength=“1024”  为最大上传1M  -->

三、代码编写

  1、说明下:我用的是mvc模式 所以这里就用mvc的方式编写 (代码是不变的,开发者可以根据你们的设计模式编写)

  2、建立一个控制器PageBaseController在该控制器里编写如下代码 (如果是用的aspx页面那么把FileUpdateView方法删掉  ,把UploadifyFile 方法的ActionResult改成void  并去掉return null;) 

   后端代码如下

         /// <summary>
/// 文件上传页面
/// </summary>
/// <returns></returns>
public ActionResult FileUpdateView()
{
return View();
} /// <summary>
/// 文件处理方法
/// </summary>
/// <param name="filedata"></param>
/// <returns></returns>
public ActionResult UploadifyFile(HttpPostedFileBase filedata)
{
if (filedata == null ||
String.IsNullOrEmpty(filedata.FileName) ||
filedata.ContentLength == )
{
return HttpNotFound();
} string filename = System.IO.Path.GetFileName(filedata.FileName);
string virtualPath = String.Format("~/File/{0}", filename); string path = Server.MapPath(virtualPath);
// 以下注释的代码 都可以获得文件属性
// System.Diagnostics.FileVersionInfo info = System.Diagnostics.FileVersionInfo.GetVersionInfo(path);
// FileInfo file = new FileInfo(filedata.FileName); filedata.SaveAs(path);
return null;
}

     注:virtualPath 是我们搭建上传文件的目录

  3、在视图(页面)里引用我们搭建的js:uploadfiy 、layer 路径

列如:

<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/lib/layer/layer.js"></script>
<link href="~/Scripts/lib/uploadify/uploadify.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/lib/uploadify/jquery.uploadify.min.js"></script>

注:这里我们用到了jquery

  4、前端代码

 <script type="text/javascript">
var uploadifyOnSelectError;
var uploadifyOnUploadError;
var uploadifyOnSelect;
var uploadifyOnUploadSuccess;
uploadifyOnSelectError = function (file, errorCode, errorMsg) {
var msgText = "上传失败\n";
switch (errorCode) {
case SWFUpload.QUEUE_ERROR.QUEUE_LIMIT_EXCEEDED:
//this.queueData.errorMsg = "每次最多上传 " + this.settings.queueSizeLimit + "个文件";
msgText += "每次最多上传 " + this.settings.queueSizeLimit + "个文件";
break;
case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT:
msgText += "文件大小超过限制( " + this.settings.fileSizeLimit + " )";
break;
case SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE:
msgText += "文件大小为0";
break;
case SWFUpload.QUEUE_ERROR.INVALID_FILETYPE:
msgText += "文件格式不正确,仅限 " + this.settings.fileTypeExts;
break;
default:
msgText += "错误代码:" + errorCode + "\n" + errorMsg;
}
layer.msg(msgText);
};
uploadifyOnUploadError = function (file, errorCode, errorMsg, errorString) {
// 手工取消不弹出提示
if (errorCode == SWFUpload.UPLOAD_ERROR.FILE_CANCELLED
|| errorCode == SWFUpload.UPLOAD_ERROR.UPLOAD_STOPPED) {
return;
}
var msgText = "上传失败\n";
switch (errorCode) {
case SWFUpload.UPLOAD_ERROR.HTTP_ERROR:
msgText += "HTTP 错误\n" + errorMsg;
break;
case SWFUpload.UPLOAD_ERROR.MISSING_UPLOAD_URL:
msgText += "上传文件丢失,请重新上传";
break;
case SWFUpload.UPLOAD_ERROR.IO_ERROR:
msgText += "IO错误";
break;
case SWFUpload.UPLOAD_ERROR.SECURITY_ERROR:
msgText += "安全性错误\n" + errorMsg;
break;
case SWFUpload.UPLOAD_ERROR.UPLOAD_LIMIT_EXCEEDED:
msgText += "每次最多上传 " + this.settings.uploadLimit + "个";
break;
case SWFUpload.UPLOAD_ERROR.UPLOAD_FAILED:
msgText += errorMsg;
break;
case SWFUpload.UPLOAD_ERROR.SPECIFIED_FILE_ID_NOT_FOUND:
msgText += "找不到指定文件,请重新操作";
break;
case SWFUpload.UPLOAD_ERROR.FILE_VALIDATION_FAILED:
msgText += "参数错误";
break;
default:
msgText += "文件:" + file.name + "\n错误码:" + errorCode + "\n"
+ errorMsg + "\n" + errorString;
}
layer.msg(msgText);
}; uploadifyOnSelect = function () {
};
uploadifyOnUploadSuccess = function (file, data, response) {
layer.msg(file.name + "\n\n" + response + "\n\n" + data);
};
$(function () { $("#uploadify").uploadify({
uploader: '/PageBase/UploadifyFun', //处理上传的方法
swf: '/Scripts/lib/uploadify/uploadify.swf',
width: , // 按钮宽度
height: , //按钮高度
buttonText: "上传文件",
buttonCursor: 'hand',
fileSizeLimit:,
fileobjName: 'Filedata',
fileTypeExts: '*.xlsx;*.docx', //扩展名
fileTypeDesc: "请选择xslx,docx文件", //文件说明
auto: false, //是否自动上传
multi: true, //是否一次可以选中多个文件
queueSizeLimit: , //允许同时上传文件的个数
overrideEvents: ['onSelectError', 'onDialogClose'], // 是否要默认提示 要就不配置
onSelect: uploadifyOnSelect,
onSelectError: uploadifyOnSelectError,
onUploadError: uploadifyOnUploadError,
onUploadSuccess: uploadifyOnUploadSuccess
});
});
</script>
<span id="uploadify"></span>
<div>
<a href="javascript:$('#uploadify').uploadify('upload','*');">上传</a>
<a href="javascript:$('#uploadify').uploadify('cancel', '*');">取消</a>
</div>

  注:fileSizeLimit 属性的值最好和我们web.config 里设置的文件上传最大值一样(不能大于这个值)

  到这里。我们文件上传就结束了。

   喜欢我的文章就关注我吧,有疑问可以留言。

 

C# 文件上传(可以多文件上传)的更多相关文章

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

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

  2. spring mvc文件上传(单个文件上传|多个文件上传)

    单个文件上传spring mvc 实现文件上传需要引入两个必须的jar包    1.所需jar包:                commons-fileupload-1.3.1.jar       ...

  3. php实现文件上传与下载(上)

    php实现文件的上传与下载是一个挺基本的功能,一般网站多多少少都会有这样的需求在内,当然不是说所有的文件都可以被上传,那这网络就太没有安全性可言了.因为接触php时间不长,今天写练练手,随笔也就是公开 ...

  4. SecureCRT上传和下载文件

    SecureCRT上传和下载文件(下载默认目录) SecureCR 下的文件传输协议有ASCII .Xmodem .Ymodem .Zmodem ASCII:这是最快的传输协议,但只能传送文本文件. ...

  5. thinkphp如何一次性的上传多个文件,在文件域中可以多选?

    可以做到类似于某度网盘的样式吗? 文件夹的命名, 可以用单数, 也可以用复数, 在同一个项目中, 只要统一就好了. 毕竟项目开发不同于英语写作. 建议使用缩写, 不管是不是缩写都用单数, 这样简洁,容 ...

  6. Drupal8重命名上传的中文名文件

    完整的模块代码文件在Coding.net上,想直接使用的请前往下载:https://coding.net/u/yamus/p/chinese_rename/git/tree/master 最近吧Dru ...

  7. WordPress上传含有中文文件出现乱码

    最近打算学习安装配置WordPress,当然同时也在学习PHP+MySQL,希望以后能做一些关于WordPress定制和二次开发,包括主题和插件.在成功安装WordPress3.5中文版之后,就测试了 ...

  8. SpringMVC 实现POI读取Excle文件中数据导入数据库(上传)、导出数据库中数据到Excle文件中(下载)

    读取Excale表返回一个集合: package com.shiliu.game.utils; import java.io.File; import java.io.FileInputStream; ...

  9. 11、只允许在主目录下上传和下载文件,不允许用putty登录

    创建用户xiao,   使其只允许在用户主目录 (/var/www/html)下上传和下载文件,不允许用putty登录 (为了安全起见,不给过多的权限) 1.创建xiao用户 [root@localh ...

  10. springMvc 使用ajax上传文件,返回获取的文件数据 附Struts2文件上传

    总结一下 springMvc使用ajax文件上传 首先说明一下,以下代码所解决的问题 :前端通过input file 标签获取文件,通过ajax与后端交互,后端获取文件,读取excel文件内容,返回e ...

随机推荐

  1. 定时任务框架APScheduler学习详解

    APScheduler简介 在平常的工作中几乎有一半的功能模块都需要定时任务来推动,例如项目中有一个定时统计程序,定时爬出网站的URL程序,定时检测钓鱼网站的程序等等,都涉及到了关于定时任务的问题,第 ...

  2. web works importScripts

    html: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <tit ...

  3. HTML5 之文件操作(file)

    前言 在 HTML 文档中 <input type="file"> 标签每出现一次,一个 FileUpload 对象就会被创建. 该元素包含一个文本输入字段,用来输入文 ...

  4. Modbus通信协议的压力测试

    最近物联网都比较的火,因此,特别为各位兄弟姐妹们,奉上一款Mobus协议的测试软件,可以用来做设备的压力测试,和通信测试. 起初软件开发缘由是我们最近在开发一款设备,需要将多个DS18B20并联起来, ...

  5. Android实战(一)学习了多个控件实现登录及记住密码功能

    首先确定一下需要的控件: 两个EditText:用于输入账号和密码 一个button:用于登录查看账号和密码是否正确 一个checkbox:用于记住密码和账户 一个Androidstudio:用于编写 ...

  6. POPTEST学员就业面试题目!!!!!

    POPTEST学员就业面试题目!!!!!   poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.(欢迎大家咨询软件测试工程师就业培训 ...

  7. AngularJS1.X学习笔记4-内置事件指令及其他

    AngularJS为我们定义了一系列事件指令,方便我们对用户的操作作出响应.甚至他还有一个可选模块提供了触摸事件和手势事件的支持,为移动端开发提供了可能.现在开始学习一下AngularJS的事件指令. ...

  8. .NetCore上传多文件的几种示例

    本章和大家分享的是.NetCore的MVC框架上传文件的示例,主要讲的内容有:form方式提交上传,ajax上传,ajax提交+上传进度效果,Task并行处理+ajax提交+上传进度,相信当你读完文章 ...

  9. 数据源C3P0配置

    1.导入jar包(dbutil->QueryRunner) 2.C3P0Util工具类 package com.learning.utils; import java.beans.Propert ...

  10. java中创建对象中使用默认构造函数的注意点

    public class Test3 {   private int n;   Test3() {      System.out.println("调用默认构造器");   }  ...