網上有很多無刷新文件上傳的代碼看了很多感覺都比較復雜有些封裝的很好但是又缺乏了靈活性個人覺得其實無刷新文件上傳並不麻煩所以寫下此文供大家參考批評
好了閒話不多說現在我們現在就從頭來實現一個無刷新文件上傳的功能
首先建立一個名為FileUpIframeaspx的頁面代碼如下（注本文中的js全部采用jQuery操作）
<html xmlns= >
<head runat=server>
<title>無標題頁</title>
<script type=text/javascript src=js/jqueryminjs></script>
<script type=text/javascript>
function setfile(filename)
{
$(#hd)val(filename);
alert(上傳成功);
}
function getfilename()
{
return $(#hd)val();
}
</script>
</head>
<body>
<form id=form runat=server>
<div>
無刷新的上傳<asp:FileUpload ID=fu runat=server/><asp:Button ID=Button runat=server Text=upFile OnClick=Button_Click />
<asp:HiddenField ID=hd runat=server />
</div>
</form>
</body>
</html>
以下是FileUpIframeaspxcs代碼
protected void Button_Click(object sender EventArgs e)
{
string filename = fuFileName;//獲取上傳的文件名
/*******************
此處為文件上傳的具體操作代碼略
********************/
//如果上傳成功就調用setfile()這個js方法此方法的功能很簡單一看就明白了
ClientScriptRegisterStartupScript(typeof(string) <script>setfile( + filename + )</script>);
}
好了這個頁面搞定了下面就好辦了
我們再建立一個頁面名為FileUpTestaspx代碼如下
<html xmlns= >
<head runat=server>
<title>文件無刷新上傳</title>
<script type=text/javascript src=js/jqueryminjs></script>
<script type=text/javascript>
function sethds()
{
var filename = frames[fileframe]getfilename();
$(#hds)val(filename);
}
</script>
</head>
<body>
<form id=form runat=server>
<div>
<iframe src=FileUpIframeaspx name=fileframe width=px height=px scrolling=no frameborder= marginheight= marginwidth= hspace= vspace= border=></iframe>
<br /> 會刷新的上傳<asp:FileUpload ID=FileUpload runat=server /><asp:Button ID=Button runat=server Text=upFile OnClick=Button_Click />
<p onclick=$(this)hide()>先點擊我讓我消失後再開始上傳如果上傳後我出現了表示刷新影響到了本頁面反之則沒有刷新</p>
<br />
<input id=Button type=button value=sethd onclick=sethds()/><%從iframe的頁面中取文件名設置到此頁面的hidden%>
<input id=Button type=button value=gethd onclick=alert($(#hds)val())/><%從本頁面的hidden中取出上傳的文件名%>
<asp:HiddenField ID=hds runat=server />
</div>
</form>
</body>
</html>
其中id為Button的按鈕是用來設置id為hds的hidden控件的值id為Button的按鈕是用來獲取hidden的值關鍵就在Button上了Button使用的sethds()方法中的frames[fileframe]getfilename();這句其實是調用的FileUpIframeaspx這個頁面上的getfilename();方法此方法直接獲取了FileUpIframeaspx中hidden的值而那個值就是我們上傳成功後設置的文件名因為FileUpIframeaspx是放在FileUpTestaspx頁面的iframe中的所以整個頁面的刷新是不會出現
至此一個無刷新上傳就完成了
From:http://tw.wingwit.com/Article/program/net/201311/12423.html
