前台aspx

//图片预览和描述
function previewImage(file) {
var div = document.getElementById('preview');
div.innerHTML = "";
for (var i = 0; i < file.files.length; i++) {
//alert(file.files[i]);
var ndiv = document.createElement("div");
ndiv.style.height = "150px";
ndiv.style.width = "300px";
ndiv.style.cssFloat = "left";
var img = document.createElement("img");
var textArea = document.createElement("textarea");
textArea.style.width = "100";
textArea.style.height = "60px";
textArea.setAttribute("name", "note"+i);//给填写备注的控件一个名字,和图片数量关联
ndiv.appendChild(img);
ndiv.appendChild(textArea);
img.id = "img" + i;
div.appendChild(ndiv);
img.width = 200;
img.height = 200;

}
for (var i = 0; i < file.files.length; i++) {
var pic = document.getElementById("img" + i);
pic.src = window.URL.createObjectURL(file.files[i]);

}

}

<form id="form1" method="post" runat="server" enctype="multipart/form-data">
<div style="text-align: center">
<div>
<h3>车辆图片上传</h3>
<input type="file" multiple="multiple" οnchange="previewImage(this)" id="myimage" runat="server" class="btn btn-default" style="margin-left: 40%; height: 69px; width: 280px" />
<p id="MyFile">
<asp:Button runat="server" Text="确认返回" OnClick="Unnamed_Click" CssClass="btn btn-default" Height="68px" Width="124px" />
&nbsp;&nbsp;
<asp:Button runat="server" Text="开始上传" ID="UploadButton" OnClick="UploadButton_Click" CssClass="btn btn-default" Height="69px" Width="129px"></asp:Button>
</p>
<p>
<asp:Label ID="strStatus" runat="server" Font-Names="宋体" Font-Bold="True" Font-Size="9pt" Width="500px"
BorderStyle="None" BorderColor="White"></asp:Label>
</p>
</div>

<%-- 图片预览 --%>
<div id="preview">
</div>
</div>
</form>

后台cs

private void SaveImages()
{

///遍历File表单元素
HttpFileCollection files = HttpContext.Current.Request.Files;

/// 状态信息
System.Text.StringBuilder strMsg = new System.Text.StringBuilder();
strMsg.Append("上传的文件分别是:<hr color=red>");
try
{
for (int iFile = 0; iFile < files.Count; iFile++)
{
string note= Request["note"+iFile];//获取每张图片的描述内容
string fileName = files[iFile].FileName;
string path = Server.MapPath("~/upload/");
string imgType = files[iFile].ContentType.ToString(); // 图片类型

if (fileName != "" && (imgType.Equals("image/bmp") || imgType.Equals("image/jpg") || imgType.Equals("image/jpeg") || imgType.Equals("image/gif") || imgType.Equals("image/png")))
{

string upPath = FileController.GetUpPath();
fileName = iFile + "_" + fileName;
string path2 = Server.MapPath("~/upload/");
//生成原图
Byte[] oFileByte = new byte[files[iFile].ContentLength];
System.IO.Stream oStream = files[iFile].InputStream;
System.Drawing.Image oImage = System.Drawing.Image.FromStream(oStream);

int oWidth = oImage.Width; //原图宽度
int oHeight = oImage.Height; //原图高度

int tWidth = 100; //设置缩略图初始宽度
int tHeight = 100; //设置缩略图初始高度

int add1 = 20;
int add2 = 120;

Graphics g = null;
Bitmap tImage = null;

string fileExtension = System.IO.Path.GetExtension(fileName);
strMsg.Append("上传的文件类型:" + files[iFile].ContentType.ToString() + "<br>");
strMsg.Append("客户端文件地址:" + files[iFile].FileName + "<br>");
strMsg.Append("上传文件的文件名:" + fileName + "<br>");
strMsg.Append("上传文件的扩展名:" + fileExtension + "<br><hr>");
for (int i = 0; i < 4; i++)
{
//按比例计算出缩略图的宽度和高度
if (oWidth >= oHeight)
{
tHeight = (int)Math.Floor(Convert.ToDouble(oHeight) * (Convert.ToDouble(tWidth) / Convert.ToDouble(oWidth)));
}
else
{
tWidth = (int)Math.Floor(Convert.ToDouble(oWidth) * (Convert.ToDouble(tHeight) / Convert.ToDouble(oHeight)));
}
//生成缩略原图
tImage = new Bitmap(tWidth, tHeight);
g = Graphics.FromImage(tImage);
g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.High; //设置高质量插值法
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;//设置高质量,低速度呈现平滑程度
g.Clear(Color.Transparent); //清空画布并以透明背景色填充
g.DrawImage(oImage, new Rectangle(0, 0, tWidth, tHeight), new Rectangle(0, 0, oWidth, oHeight), GraphicsUnit.Pixel);
string savePath2 = path + files[iFile].FileName;
string savePath = "~/upload/" + "(" + tWidth + "-" + tHeight + ")" + fileName;
try
{
//以JPG格式保存图片
//oImage.Save(oFullName, System.Drawing.Imaging.ImageFormat.Jpeg);
tImage.Save(path2 + "(" + tWidth +"-"+ tHeight + ")" + fileName, System.Drawing.Imaging.ImageFormat.Jpeg);
//保存图片路径到数据库
inv_worklistInfo inv_wlInfo = new inv_worklistInfo();
inv_wlInfo.picurl = savePath;
inv_wlInfo.workid = workid;
inv_wlInfo.notes = note;
inv_worklistFactory.Create().Add(inv_wlInfo);
}
catch (Exception ex)
{
strStatus.Text = ex.Message;
}
if (i == 0)
{
tWidth = 100 + add1; //设置缩略图初始宽度
tHeight = 100 + add1; //设置缩略图初始高度
}
if (i == 1)
{
tWidth = 100 + add2; //设置缩略图初始宽度
tHeight = 100 + add2; //设置缩略图初始高度
}
if (i == 2)
{
tWidth = oWidth; //设置缩略图初始宽度
tHeight = oHeight; //设置缩略图初始高度
}
}
释放资源
if (!CmpUtil.IsNullOEmp(oImage))
{
oImage.Dispose();
}
if (!CmpUtil.IsNullOEmp(g))
{
g.Dispose();
}
if (!CmpUtil.IsNullOEmp(tImage))
{
tImage.Dispose();
}
}
else
{
JSController.Alert(this, "图片格式只支持:jpeg,jpg,png,bmp,gif");
}
}
strStatus.Text = strMsg.ToString();
}
catch (System.Exception Ex)
{
strStatus.Text = Ex.Message;
}
}

}

转载于:https://www.cnblogs.com/ctautocn/p/4231704.html

asp.net多图片上传同时保存对每张图片的描述相关推荐

  1. 图片上传并保存到数据库以及显示图片

    图片上传并保存到数据库以及显示图片 此处是用保存图片相对路径的方法,上传图片. 1. 首先创建数据库表: create table images ( image_ID int primary key ...

  2. java 图片上传 并保存服务器本地 后台 代码

    java 图片上传后台代码,把图片保存到服务器本地盘,并且按照一天一个文件夹分开存放,易于管理,不说了直接上代码: @Controller @RequestMapping("/oa" ...

  3. 微信内置浏览器无法使用input图片上传和lrz.bundle.js图片压缩插件

    标题 微信内置浏览器无法使用input图片上传和lrz.bundle.js图片压缩插件 图片上传功能作为一个比较常见的功能,有时候需要在微信内置浏览器里打开,但是有些型号的手机会出现打不开的现象,点击 ...

  4. $_post 数据上传到那个位置_如何实现图片上传并保存到数据库?

    (给Web前端雪儿加星标,提升前端技能) 之前写过图片上传的案例,但是时间一长就忘了,这次写的这个程序用到了图片的上传,并且能够图文显示,所以写了这篇文章来记录一下.由于人们的生活质量的提高及网络的发 ...

  5. form表单提交按钮点击事件先触发还是提交数据先触发_如何实现图片上传并保存到数据库?...

    (给Web前端雪儿加星标,提升前端技能) 之前写过图片上传的案例,但是时间一长就忘了,这次写的这个程序用到了图片的上传,并且能够图文显示,所以写了这篇文章来记录一下.由于人们的生活质量的提高及网络的发 ...

  6. 在BAE搭建的Django中实现图片上传并用jquery预览图片

    在BAE上搭建好了django,如何实现图片上传并预览呢? 想要实现图片上传并不难,但是想看到刚上传的图片,就得在服务器返回上传后图片的url.可是返回数据的话,网页就会重定向.因此想要在上传页面预览 ...

  7. java多图片上传json_SpringMVC框架五:图片上传与JSON交互

    在正式图片上传之前,先处理一个细节问题: 每一次发布项目,Tomcat都会重新解压war包,之前上传过的图片会丢失 为了解决这个问题:可以不在Tomcat下保存图片,而是另找一个目录. 上传图片: 在 ...

  8. 百度编辑器图片上传 java_百度编辑器粘贴图片自动上传到服务器(Java版)

    Chrome+IE默认支持粘贴剪切板中的图片,但是我要发布的文章存在word里面,图片多达数十张,我总不能一张一张复制吧? Chrome高版本提供了可以将单张图片转换在BASE64字符串的功能.但是无 ...

  9. java下传图片到tomcat服务器后,如何在页面显示,java图片上传服务器及客户端显示图片...

    我在上一篇文章SSM+Layui实现文件上传服务器中展示了如何将图片上传至服务器,保存到SQL server数据库中,本篇文章主要讲的是将图片上传到服务器上,保存在服务器的磁盘上,然后将图片路径保存到 ...

  10. java canvas添加图片上传_HTML5 canvas画图及图片上传服务器

    上一个教程中我们实现了使用html5 canvas来制作涂鸦画板的效果,在这个教程中,我们将讲解如何将画好的图片上传到服务器上. 最后的效果如下图,当点击"开始画图"按钮,将在ca ...

最新文章

  1. 同花顺的数据格式总览(转帖)
  2. 19号晚-21号上午
  3. yaf框架学习文件配置
  4. matlab程序设计图像匹配,灰度,归一化算法,快速匹配。有代码好用。转载
  5. 公司这个月要同时完成好多项目!!!
  6. data的值 如何初始化vue_理解Vue响应式系统
  7. 【五级流水线CPU】—— 4. 移动操作指令(6条)
  8. [Silverlight]如何创建超链接
  9. Node.js 推荐20多个学习网站及书籍
  10. ASP.NET里的路径的使用-预备篇
  11. 小农民在深山树林里发现古墓_“快来!快来!这边有一个洞!”秦岭多古墓,难不成还真碰到了?...
  12. PDF文档全篇免费翻译技巧
  13. python教程视频ajax_Ajax教程
  14. AXURE 8.1.0.3382 有效激活码
  15. WIN10桌面美化(折腾)
  16. Markdown基础语法详细版
  17. 06 基于v5-resources在macos系统搭建a8服务
  18. Consistent 与 Mirrored 视角
  19. 小数点后两位向上取值
  20. 三栏布局的七种实现方式

热门文章

  1. java 常用缓存描述
  2. Java简历模板(三十个模板随意选)
  3. SqlServer递归查询树形结果数据
  4. string进行大小写转换
  5. jenkins用户凭证插件的安装
  6. koa2与php比较,模仿KOA,用php来写一个极简的开发框架
  7. fetch与axios
  8. Java基础:等待唤醒机制、线程池
  9. Java编程:排序算法
  10. Git:操作报错:fatal: ‘origin‘ does not appear to be a git repository解决方案