改变上传文件的按钮样式:

<div id="post-upload-image">
<div id="divfile_-1">
<input id="file_-1" type="file" name="file" style="display:none;" onchange="selectImage('file_-1')" /> <label for="file_-1" style="font-weight:normal; cursor:pointer;" class="publish-space-form-img text-center publish-add-img">
<i class="glyphicon glyphicon-plus"></i>
<br />插入图片
</label>
</div>
</div>

MVC中选择图片:有多少个<input type="flie" />控制器中通过Request.Form.Files就会接受到多少张图片。

 function selectImage(id) {
var fileInput = document.getElementById(id);
var file = fileInput.files[0];
if (fileInput.files && file) {
imageI += 1;
var reader = new FileReader();
reader.onload = function (e) {
$("<div class='publish-post-image'>" +
"<div class='publish-space-form-img text-center publish-div-shadow' style='display:none;'>" +
"<i class='glyphicon glyphicon-trash'></i>" +
"</div>" +
"<img src='" + e.target.result + "' class='publish-space-form-img' id='image_" + imageI + " '/>" +
"</div>"
).appendTo('#post-images'); var selectIdName = '#divfile_' + (imageI - 1);
$(selectIdName).hide(); $("<div id='divfile_" + imageI + "'>" +
"<input id='file_" + imageI + "' type='file' name='file' style='display:none;' onchange=" + "selectImage('file_" + imageI + "') />" +
"<label for='file_" + imageI + "'style='font-weight:normal; cursor:pointer;' class='publish-space-form-img text-center publish-add-img'><i class='glyphicon glyphicon-plus'></i><br />插入图片</label>" +
"</div>").appendTo("#post-upload-image");
} reader.readAsDataURL(file);
}
}

MVC上传多张图片的更多相关文章

  1. Asp.net mvc上传多张图片后台存储

    前台页面通过<file name="img">标签数组上传图片,后台根据Request.Files["img"]来接收前台上传的图片. 1 Syst ...

  2. Spring MVC上传文件

    Spring MVC上传文件 1.Web.xml中加入 <servlet> <servlet-name>springmvc</servlet-name> <s ...

  3. MVC上传文件

    ASP.NET MVC上传文件是必段撑握的知识.加强训练才是.以前Insus.NET曾使用第三方MyAjaxForm.js :http://www.cnblogs.com/insus/p/378548 ...

  4. iOS -- 上传多张图片 后台(PHP)代码和上传一张的一样

    // 上传多张图片 - (void)send { // 设置初始记录量为0 self.count = 0; self.upcount = 0; // 设置初始值为NO self.isUploadPic ...

  5. Spring MVC 上传文件

    Spring MVC上传文件需要如下步骤: 1.前台页面,form属性 method设置为post,enctype="multipart/form-data"  input的typ ...

  6. php用jquery-ajax上传多张图片限制图片大小

    php用jquery-ajax上传多张图片限制图片大小 /** * 上传图片,默认大小限制为3M * @param String $fileInputName * @param number $siz ...

  7. MVC:上传文件

    今天写了一个使用MVC上传的DEMO,很简单不超过10行代码.代码如下(关注重点,所以尽量精简掉其他代码): 项目结构

  8. 微信JSSDK上传多张图片

    之前是使用for循环实现的,但是安卓手机没有问题,苹果手机只能上传最后一张图片. 好在有高手在前面趟路,实用的循环调用.苹果是没有,安卓不清楚.以下内容转自:http://leo108.com/pid ...

  9. asp.net mvc上传头像加剪裁功能

    原文:asp.net mvc上传头像加剪裁功能 正好项目用到上传+剪裁功能,发上来便于以后使用. 我不能告诉你们其实是从博客园扒的前台代码,哈哈. 前端是jquery+fineuploader+jqu ...

随机推荐

  1. Wireshark 安装及开始抓包中出现的问题

    前两天装了Wireshark,这次安装遇到了之前没遇到的问题,所以就写出来大家参考下 安装Wireshark时需要安装集成在安装包中的winpcap[winpcap(windows packet ca ...

  2. Qtree

    Qtree Ⅰ 题意:https://vjudge.net/problem/SPOJ-QTREE 带修路径查询最大边权 sol :树链剖分,之后每条重链就是一个连续的区间,拿线段树维护即可  简单讲讲 ...

  3. djang中的request.user对象中的方法

    print(dir(request.user)) ['__class__', '__delattr__', '__dict__', '__doc__', '__eq__', '__format__', ...

  4. 第一个 spring Boot 应用通过Docker 来实现构建、运行、发布

    1. Docker 简介 Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化.容器是完全使用沙 ...

  5. 使用UE配置Python编程环境

    一直在使用UE来进行python编程,觉得在UE下进行python编程使用起来还是很方便地,现在特来总结一下: 1.首先是python环境搭建 (1)下载python2.7 https://www.p ...

  6. 洛谷P1372 a/b problem

    题目背景 “叮铃铃铃”,随着高考最后一科结考铃声的敲响,三年青春时光顿时凝固于此刻.毕业的欣喜怎敌那离别的不舍,憧憬着未来仍毋忘逝去的歌.1000多个日夜的欢笑和泪水,全凝聚在毕业晚会上,相信,这一定 ...

  7. angular关于依赖注入

    <html> <head> <title>Angular JS Forms</title> </head> <body> < ...

  8. noip 2010 关押罪犯 二分答案+二分图染色 || 并查集

    题目链接 题目描述 S 城现有两座监狱,一共关押着N 名罪犯,编号分别为1~N.他们之间的关系自然也极不和谐.很多罪犯之间甚至积怨已久,如果客观条件具备则随时可能爆发冲突.我们用"怨气值&q ...

  9. 论epoll的实现

    论epoll的实现 上一篇博客 论select的实现 里面已经说了为什么 select 比较慢.poll 的实现和 select 类似,只是少了最大 fd 限制,如果有兴趣可以自己去看代码.我这里来简 ...

  10. Linux 之 服务以及进程

    服务以及进程 参考教程:[千峰教育] 命令: vmstat: 结果: procs -----------memory---------- ---swap-- -----io---- --system- ...