//aspx
<table>
<tr>
<td>
<asp:Image ID="imgshow" runat="server" Height="80px" ToolTip="图片预览" Width="80px"
οnmοuseοver="over();" οnmοuseοut="out()" AlternateText="图片预览" ImageUrl="../../Resource/Images/noImage.gif" />
<div id="divImage" style="position: absolute; display: none; border: 9px solid gray;">
<asp:Image ID="imgbig" runat="server" ImageUrl="../../Resource/Images/noImage.gif" />
</div>
</td>
<td class="right">
<table>
<tr>
<asp:FileUpload runat="server" ID="fileImageData" Width="195px" />
</tr>
<tr>
<asp:Button ID="btn_Upload" runat="server" CssClass="nButton" Text="预览图片" OnClick="btn_Upload_Click"/>
</tr>
</table>
</td>
</tr>
</table>
//javascript
//显示图片
function over()
{
//图片的最大大小 4/3的大小 520 390
maxwidth=520;
maxheight=390;
//显示
document.getElementById('divImage').style.display="";
//设置div的位置
var obj= document.getElementById('divImage');
obj.style.left=316;
obj.style.bottom=115;//202 115
//获取img 设置图片的大小
var img=document.getElementById('divImage').firstChild;
//1、宽和高都超过了,看谁超过的多,其余策略按照2、3
//2、如果宽超过了并且高没有超,设置宽为最大值
//3、如果宽没超过并且高超过了,设置高为最大值
if(img.width>maxwidth&&img.height>maxheight)
{
pare=(img.width-maxwidth)-(img.height-maxheight);
if(pare>=0)
img.width=maxwidth;
else
img.height=maxheight;
}
else if(img.width>maxwidth&&img.height<=maxheight)
{
img.width=maxwidth;
}
else if(img.width<=maxwidth&&img.height>maxheight)
{
img.height=maxheight;
}
else
{
}
}
//隐藏图片
function out()
{
document.getElementById('divImage').style.display="none";
}
//后台
#region 图片相关操作
/// <summary>
/// 预览图片按钮事件
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void btn_Upload_Click(object sender, EventArgs e)
{
PictureSee();
}
/// <summary>
/// 预览图片
/// </summary>
/// <returns>预览结果:0、成功;1、失败</returns>
protected int PictureSee()
{
//支持的扩展名,必须小写
string strImageType = "jpg/jpeg/gif";
//最大数据量 单位kb
int intMaxData = 500;
//图片名
string strFileName = fileImageData.FileName;
//判断是否存在图片
if (strFileName != null && strFileName != "")
{
//获取文件的扩展名,转化成小写形式,并判断是否支持该扩展名
if (strImageType.Contains(strFileName.Split('.')[1].ToLower()))
{
byte[] buffer = fileImageData.FileBytes;
//判断图片大小
int x = buffer.Length;
if (x / 1024 > intMaxData)
{
Alert("图片文件太大,不能超过500k!");
return 1;
}
else
{
//开始预览
Session["image"] = buffer;
this.imgshow.ImageUrl = "~/Pages/MatlCategoryManagerMod/ShowImage.aspx";
this.imgbig.ImageUrl = "~/Pages/MatlCategoryManagerMod/ShowImage.aspx";
}
}
else
{
Alert("不支持此扩展名图片!");
return 1;
}
}
return 0;
}
#endregion
显示用aspx
/// <summary>
/// 页面初始化
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void Page_Load(object sender, EventArgs e)
{
//查询数据库获取图片
if (Request["传过来的参数名"] != null)
{
//查询
DataSet ds = 从数据库中查询
byte[] img = null;
if (ds.Tables.Count > 0)
{
DataTable dtimg = ds.Tables[0];
if (dtimg.Rows.Count > 0)
{
if (!(dtimg.Rows[0]["BPICTCONTENT"] is System.DBNull))
{
//显示图片
img = (byte[])dtimg.Rows[0]["BPICTCONTENT"] as byte[];
Session["image"] = img;
Response.ContentType = "application/octet-stream";
Response.BinaryWrite(img);
Response.End();
}
}
}
}
else //显示session中的图片
{
if (Session["image"] != null)
{
//显示图片
byte[] img = (byte[])Session["image"];
Response.ContentType = "application/octet-stream";
Response.BinaryWrite(img);
Response.End();
}
}
}