效果如下:
实现代码:
JS脚本如下:
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--> <script language="javascript" type="text/javascript">
function getFullPath(obj)
{
if(obj)
{
//ie
if (window.navigator.userAgent.indexOf("MSIE")>=1)
{
obj.select();
return document.selection.createRange().text;
}
//firefox
else if(window.navigator.userAgent.indexOf("Firefox")>=1)
{
if(obj.files)
{
return obj.files.item(0).getAsDataURL();
}
return obj.value;
}
return obj.value;
}
}
function yulan()
{
var filePath =getFullPath(document.getElementById('UpFile'));
var fileText =filePath.substring(filePath.lastIndexOf("."),filePath.length);
var fileName =fileText.toLowerCase();
if ((fileName!='.jpg')&&(fileName!='.gif')&&(fileName!='.jpeg')&&(fileName!='.png')&&(fileName!='.bmp'))
{
alert("对不起,系统仅支持标准格式的照片,请您调整格式后重新上传,谢谢 !");
document.form1.UpFile.focus();
}
else
{
document.getElementById("preview").innerHTML="<img src='"+getFullPath(document.getElementById('UpFile'))+"' width=120 style='border:6px double #ccc'>";
}
}
</script>
ASPX页面代码:
<input type="file" id="UpFile" class="stylebtn" name="UpFile" onchange="yulan()" />;
<asp:Button ID="btnUpload" runat="server" Text="上 传"
onclick="btnUpload_Click" Height="22px" CssClass="stylebtn"/>
<div id="preview"></div>
在IE7下测试正常 !