C# 自定义FileUpload控件

摘要:ASP.NET自带的FileUpload控件会随着浏览器的不同,显示的样式也会发生改变,很不美观,为了提高用户体验度,所以我们会去自定义FileUpload控件

实现思路:用两个Button和TextBox控件来替代FileUpload控件,当点击Button时触发FileUpload控件的点击事件,然后通过JS把FileUpload控件的Value赋给TextBox

代码:

aspx文件:

 <html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="FileUp" runat="server" Style="display:none;width: 180px" />
<asp:TextBox ID="txtFileName" runat="server" MaxLength="" Width="170px"></asp:TextBox>
<asp:Button id="btnBrowse" runat="server" style="width:60px" CssClass="btn" OnClientClick="return ShowBrowse()"
Text="Browse" />
<asp:Button ID="btnUpload" runat="server" Width="60px" CssClass="btn" OnClick="btnUpload_Click"
Text="Upload" />
</div>
</form>
<script language="javascript" type="text/javascript">
function ShowBrowse()
{
var file1=document.getElementById("FileUp");
if(file1)
{
file1.click();
var isie = (document.all) ? true : false; //判断是IE内核还是Mozilla
return isie; //火狐浏览器加return false才会在选择文件后将文件名带回到textbox,IE如果返回false上传时要点击两次按钮才触发
}
}
</script>
</body>
</html>

JS文件:

 function Check_FilePath() {
var FilePath = document.getElementById("FileUp");
var FileNewName = document.getElementById("txtFileName");
if (FilePath.value != '')
{
FileNewName.value = FilePath.value;
}
}

aspx.cs文件:

 //Page_Load事件
this.FileUp.Attributes.Add("onchange", "javascript:return Check_FilePath();");
 //btnUpload_Click事件
//当点击btnUpload_Click时,把文件上传到指定路径
//需要考虑多浏览器的问题,如果是IE,直接用FileUpload控件的SaveAs功能,会保存一个空文件
string strFileName="本地保存文件的路径";
if (HttpContext.Current.Request.Browser.Browser == "IE")
{
WebClient wClient = new WebClient();
wClient.DownloadFile(this.txtFileName.Text.Trim(), strFileName);
}
else
{
this.FileUp.PostedFile.SaveAs(strFileName);
}

遗留问题:当IE浏览器安全级别高时,会取不到文件的完整路径,类似于C:\fakepath\TP.jpg,而导致保存不了;

网上的很多解决办法是手动更改IE浏览器的安全级别,我在想是否可以在代码中实现更改IE浏览器的安全级别,研究ing......

希望有解决方案的朋友们可以分享一下:)

上一篇:手写数字识别


下一篇:Centos7下安装iF.svnadmin实现web方式管理svn(源码安装)