62,047
社区成员
发帖
与我相关
我的任务
分享
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ImageViewFileUploadControl.aspx.cs" Inherits="Test_带图片预览功能的FileUpload控件_ImageViewFileUploadControl" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
//如果用户选择了图片,则显示图片的预览效果
function previewImage() {
var x = document.getElementById("file");
if (!x || !x.value)//如果没有选择上传文件
{
return;
}
var patn = /\.jpg$|\.jpeg$|\.gif$/i;
if (patn.test(x.value))//如果上传文件的后缀是.jpg或.jpeg或.gif
{
var y = document.getElementById("imgPicture");
if (y) {
y.style.display = "";
y.src = x.value;
}
setTimeout("hidden()", 5000); //5秒之后执行隐藏图片的javascript方法
}
else {
alert("您选择的似乎不是图像文件。");
}
}
//隐藏照片
function hidden() {
var y = document.getElementById("imgPicture");
if (y) {
y.style.display = "none";
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="file" runat="server" onchange="previewImage()" /><br />
<asp:Image ID="imgPicture" runat="server" AlternateText="图片" style="display:none;" />
<asp:Button ID="btnFileUpload" runat="server" Text="上传文件" />
</div>
</form>
</body>
</html>