初始图片:

 选中图片后

 

  ----------------------------------------------------------------------------------

  前端代码
  

<script src="~/Scripts/jquery-1.8.2.min.js"></script>
@using (Html.BeginForm("SaveFile", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<div class="pageFormContent" >
<script type="text/javascript">
var num = 0;
function FileSelect(n) {
if ($("div[id*='div']").length > 0)
{
num = parseInt($("div[id*='div']").last().attr("id").replace("div", "")) + 1;
}
else {
num = 0;
num++; }
// alert("num:"+num + " n:"+n);
if (num - 1 <= n)
{
$("#DIV_Files").append('<div id="div' + num + '" > <input name="files" type="file" multiple="multiple" onclick="FileSelect(' + num + ')" /> <input type="button" name="delInput" value="移除" onclick="DelFile(div' + num + ')" /></div>');
}
}
function DelFile(sss) {
$(sss).remove();
} function onload() {
// FileSelect(0);
}
</script>
<div id="DIV_Files" style=" height:300px; width:450px; padding-left:10px; background-color:gray; overflow:scroll">
<div>
<input id="file" name="files" type="file" multiple="multiple" onclick="FileSelect(0)"/>
</div>
</div>
<input id="submit" type="submit" value="批量上传" />
@ViewBag.Msg
</div> }

     multiple="multiple":表示可以多选,js中代码实现点击最后一个上传input会立即生成一个input,并可以移除.样式什么的,自己定义 

----------------------------------------------------------------------------------

HomeController 中代码

public ActionResult Index(string message)
{
ViewBag.Msg = message;
return View();
} [HttpPost]
public ActionResult SaveFile(IEnumerable<HttpPostedFileBase> files)
{
string msg = string.Empty;
foreach (HttpPostedFileBase file in files)
{
if (file != null && file.ContentLength > 0)
{
file.SaveAs(Server.MapPath("~/") + Path.GetFileName(file.FileName));
//msg = "Suc";
}
else
{
// msg = "Fail";
}
} return RedirectToAction("Index","Home",new {message=msg});
}

  

MVC批量上传文件的更多相关文章

  1. MVC批量上传文件(使用uploadify)

    <script src="JS/jquery-1.8.3.js"></script> <script src="uploadify/jque ...

  2. spring mvc(注解)上传文件的简单例子

    spring mvc(注解)上传文件的简单例子,这有几个需要注意的地方1.form的enctype=”multipart/form-data” 这个是上传文件必须的2.applicationConte ...

  3. Linux命令之rz - 批量上传文件,简单易用(转载)

    用途说明 rz命令能够批量上传文件,当然也可上传单个文件啦.使用的协议是古老的ZMODEM协议,尽管协议古老,但毫不影响的简单易用的特性.一般情 况我们要上传文件到Linux系统,要么使用ftp(还得 ...

  4. 转 Android网络编程之使用HttpClient批量上传文件 MultipartEntityBuilder

    请尊重他人的劳动成果,转载请注明出处:Android网络编程之使用HttpClient批量上传文件 http://www.tuicool.com/articles/Y7reYb 我曾在<Andr ...

  5. 不带插件 ,自己写js,实现批量上传文件及进度显示

    今天接受项目中要完成文件批量上传文件而且还要显示上传进度,一开始觉得这个应该不是很麻烦,当我在做的时候遇到了很多问题,很头疼啊. 不过看了别人写的代码,自己也测试过,发现网上好多都存在一些问题,并不是 ...

  6. Python基于Python实现批量上传文件或目录到不同的Linux服务器

    基于Python实现批量上传文件或目录到不同的Linux服务器   by:授客 QQ:1033553122 实现功能 1 测试环境 1 使用方法 1 1. 编辑配置文件conf/rootpath_fo ...

  7. input file multiple 批量上传文件

    这几天维护系统,有一个批量上传文件功能,出现了一点小问题 我的笔记本选择要上传的文件很正常 但在测试环境上,别人的电脑上,选择上传文件之后 一开始,以为是代码问题,网上找了很多的资料,但还是没用,然后 ...

  8. Asp.Net Mvc异步上传文件的方式

    今天试了下mvc自带的ajax,发现上传文件时后端action接收不到文件, Request.Files和HttpPostedFileBase都接收不到.....后来搜索了下才知道mvc自带的Ajax ...

  9. 使用 sendKeys(keysToSend) 批量上传文件

    未经允许,禁止转载!!! 在selenium里面处理文件上传的时候可以使用sendKeys(keysToSend) 上传文件 例如: element.sendKeys(“C:\\test\\uploa ...

随机推荐

  1. 超薄二维Mo2C晶体

    记者今天从中国科学院金属研究所获悉,该所沈阳材料科学国家(联合)实验室先进炭材料研究部任文才研究组在大尺寸高质量二维过渡族金属碳化物晶体的制备与物性研究方面取得了重要突破.相关成果日前在<自然— ...

  2. 51. N-Queens (Array; Back-Track, Bit)

    The n-queens puzzle is the problem of placing n queens on an n×n chessboard such that no two queens ...

  3. 【英宝通Unity4.0公开课学习 】(一)资源管理

    经过多次面试后发现自己对Unity3D的框架缺乏一个整体的认识. 而前面由于离职等原因总是忙于修修补补,疲于奔命,感觉相当疲惫. 还好,后来经过调整,开始淡定了起来.得特别感谢一本书哇:<高效人 ...

  4. MyBatis高级查询

    -------------------------siwuxie095 MyBatis 高级查询 1.MyBatis 作为一个 ORM 框架,也对 SQL 的高级查询做了支持, MyBatis 高级查 ...

  5. TZOJ 2754 Watering Hole(最小生成树Kruskal)

    描述 Farmer John has decided to bring water to his N (1 <= N <= 300) pastures which are convenie ...

  6. IBM关闭触摸板的方法

    开始按Enter进入BIOS > Configure > Keyboard/Mouse > TouchPad,设置为DisabledF10保存退出

  7. Nginx+Keepalived实现站点高可用[z]

    http://segmentfault.com/a/1190000002881132

  8. 20172325 2017-2018-2 《Java程序设计》第六周学习总结

    20172325 2017-2018-2 <Java程序设计>第六周学习总结 教材学习内容总结 1.利用[ ]建立一个数组,整列数据可以通过数组名引用,数组中的每个元素则可以通过其在数组中 ...

  9. Java数据结构和算法(四)赫夫曼树

    Java数据结构和算法(四)赫夫曼树 数据结构与算法目录(https://www.cnblogs.com/binarylei/p/10115867.html) 赫夫曼树又称为最优二叉树,赫夫曼树的一个 ...

  10. linux信号量初识

    以下程序使用信号量控制程序运行 "信号"量 "变"量 /*信号量(semaphore)是变量,是一种特殊的变量.它仅取正值. 对信息号量的操作只有2种:等待(w ...