本教程是利用asp教程.net c#讓web控制項fileupload選擇完檔案之後就自動觸發事件，並且image控制項顯示出圖片來
<%@ page language="c#" contenttype="text/html" responseencoding="gb2312" %>
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.111cn.net/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>c#web控制項fileupload圖片上傳(並產生小圖）</title>
</head>
<body>
<script language="網頁特效" type="text/javascript">
function previewimg(imgfile)
{
var newpreview = document.getelementbyid("newpreview");
newpreview.filters.item("dximagetransform.microsoft.alphaimageloader").src = imgfile.value;
newpreview.style.width = "80px";
newpreview.style.height = "60px";
}
</script>
<asp:fileupload id="fileupload1" runat="server" onchange="previewimg(this)" />
<div id="newpreview"> </div><script>
function $(o){return document.getelementbyid(o);}
function checkimg(o,img)
{
if (!/.((jpg)|(bmp)|(gif)|(png))$/ig.test(o.value))
{
alert('只能上傳jpg,bmp,gif,png格式圖片!');
o.outerhtml = o.outerhtml;
}
else
{
$(img).filters.item("dximagetransform.microsoft.alphaimageloader").src=o.value;
}
}
</script>
<asp:fileupload id="fileupload1" runat="server" onchange="checkimg(this, 'img');" />
<div id="img" style="filter:progid:dximagetransform.microsoft.alphaimageloader(src= <%= pic%>,sizingmethod=scale);width:88px;height:113px;"> </div>
public string pic="";
</body>
</html>
<%
using system;
using system.data;
using system.configuration;
using system.collections;
using system.web;
using system.web.security;
using system.web.ui;
using system.web.ui.webcontrols;
using system.web.ui.webcontrols.webparts;
using system.web.ui.htmlcontrols;
using system.io;
public partial class upfile_upfile : system.web.ui.page
{
protected void page_load(object sender, eventargs e)
{ }
protected void button1_click(object sender, eventargs e)
{
if (fileupload1.hasfile)
{
string filecontenttype = fileupload1.postedfile.contenttype;
if (filecontenttype == "image/bmp" || filecontenttype == "image/gif" || filecontenttype == "image/pjpeg")
{
string name = fileupload1.postedfile.filename; // 用戶端檔案路徑fileinfo file = new fileinfo(name);
string filename = file.name; // 檔案名稱
string filename_s = "s_" + file.name; // 縮圖檔案名稱
string filename_sy = "sy_" + file.name; // 浮水印圖檔案名稱（文字）
string filename_syp = "syp_" + file.name; // 浮水印圖檔案名稱（圖片）
string webfilepath = server.mappath("file/" + filename); // 伺服器端檔案路徑
string webfilepath_s = server.mappath("file/" + filename_s); // 伺服器端縮圖路徑
string webfilepath_sy = server.mappath("file/" + filename_sy); // 伺服器端帶浮水印圖路徑(文字)
string webfilepath_syp = server.mappath("file/" + filename_syp); // 伺服器端帶浮水印圖路徑(圖片)
string webfilepath_sypf = server.mappath("file/shuiyin.jpg"); // 伺服器端浮水印圖路徑(圖片)if (!file.exists(webfilepath))
{
try
{
fileupload1.saveas(webfilepath); // 使用 saveas 方法儲存檔案
addshuiyinword(webfilepath, webfilepath_sy);
addshuiyinpic(webfilepath, webfilepath_syp, webfilepath_sypf);
makethumbnail(webfilepath, webfilepath_s, 130, 130, "cut"); // 產生縮圖方法
label1.text = "提示：檔案"" + filename + ""成功上傳，並產生"" + filename_s + ""縮圖，檔案類型為：" + fileupload1.postedfile.contenttype + "，檔案大小為：" + fileupload1.postedfile.contentlength + "b";
}
catch (exception ex)
{
label1.text = "提示：檔案上傳失敗，失敗原因：" + ex.message;
}
}
else
{
label1.text = "提示：檔案已經存在，請重新命名後上傳";
}
}
else
{
label1.text = "提示：檔案類型不符";
}
}
}
/// <summary>
/// 產生縮圖
/// </summary>
/// <param name="originalimagepath">源圖路徑（實體路徑）</param>
/// <param name="thumbnailpath">縮圖路徑（實體路徑）</param>
/// <param name="width">縮圖寬度</param>
/// <param name="height">縮圖高度</param>
/// <param name="mode">產生縮圖的方式</param>
public static void makethumbnail(string originalimagepath, string thumbnailpath, int width, int height, string mode)
{
system.drawing.image originalimage = system.drawing.image.fromfile(originalimagepath);
int towidth = width;
int toheight = height;
int x = 0;
int y = 0;
int ow = originalimage.width;
int oh = originalimage.height;
switch (mode)
{
case "hw"://指定高寬縮放（可能變形）
break;
case "w"://指定寬，高按比例
toheight = originalimage.height * width / originalimage.width;
break;
case "h"://指定高，寬按比例
towidth = originalimage.width * height / originalimage.height;
break;
case "cut"://指定高寬裁減（不變形）
if ((double)originalimage.width / (double)originalimage.height > (double)towidth / (double)toheight)
{
oh = originalimage.height;
ow = originalimage.height * towidth / toheight;
y = 0;
x = (originalimage.width - ow) / 2;
}
else
{
ow = originalimage.width;
oh = originalimage.width * height / towidth;
x = 0;
y = (originalimage.height - oh) / 2;
}
break;
default:
break;
}
//建立一個bmp圖片
system.drawing.image bitmap = new system.drawing.bitmap(towidth, toheight);
//建立一個畫板
system.drawing.graphics g = system.drawing.graphics.fromimage(bitmap);
//設定高品質插值法
g.interpolationmode = system.drawing.drawing2d.interpolationmode.high;
//設定高品質,低速度呈現平滑程度
g.smoothingmode = system.drawing.drawing2d.smoothingmode.highquality;
//清空畫布並以透明背景色填充
g.clear(system.drawing.color.transparent);
//在指定位置並且按指定大小繪製原圖片的指定部分
g.drawimage(originalimage, new system.drawing.rectangle(0, 0, towidth, toheight),
new system.drawing.rectangle(x, y, ow, oh),
system.drawing.graphicsunit.pixel);
try
{
//以jpg格式儲存縮圖
bitmap.save(thumbnailpath, system.drawing.imaging.imageformat.jpeg);
}
catch (system.exception e)
{
throw e;
}
finally
{
originalimage.dispose();
bitmap.dispose();
g.dispose();
}
}
/// <summary>
/// 在圖片上增加文字浮水印
/// </summary>
/// <param name="path">原伺服器圖片路徑</param>
/// <param name="path_sy">產生的帶文字浮水印的圖片路徑</param>
protected void addshuiyinword(string path, string path_sy)
{
string addtext = "測試浮水印";
system.drawing.image image = system.drawing.image.fromfile(path);
system.drawing.graphics g = system.drawing.graphics.fromimage(image);
g.drawimage(image, 0, 0, image.width, image.height);
system.drawing.font f = new system.drawing.font("verdana", 16);
system.drawing.brush b = new system.drawing.solidbrush(system.drawing.color.blue);
g.drawstring(addtext, f, b, 15, 15);
g.dispose();
image.save(path_sy);
image.dispose();
}
/**//// <summary>
/// 在圖片上產生圖片浮水印
/// </summary>
/// <param name="path">原伺服器圖片路徑</param>
/// <param name="path_syp">產生的帶圖片浮水印的圖片路徑</param>
/// <param name="path_sypf">浮水印圖片路徑</param>
protected void addshuiyinpic(string path, string path_syp, string path_sypf)
{
system.drawing.image image = system.drawing.image.fromfile(path);
system.drawing.image copyimage = system.drawing.image.fromfile(path_sypf);
system.drawing.graphics g = system.drawing.graphics.fromimage(image);
g.drawimage(copyimage, new system.drawing.rectangle(image.width - copyimage.width, image.height - copyimage.height, copyimage.width, copyimage.height), 0, 0, copyimage.width,copyimage.height, system.drawing.graphicsunit.pixel);
g.dispose();
image.save(path_syp);
image.dispose();
}
>
下載地址
http://down.111cn.net/down/code/net/2010/0817/20267.html
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
