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

2023-05-16,,

前台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" onchange="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;
}
}

}

asp.net多图片上传同时保存对每张图片的描述的相关教程结束。

《asp.net多图片上传同时保存对每张图片的描述.doc》

下载本文的Word格式文档,以方便收藏与打印。