|
|
本帖最后由 hongniu 于 2015-6-25 16:28 編輯
這個客戶就是上帝的年代里一個好的用戶體驗比實用的功能要得民心，上傳大文件時長期的白屏自己看著都煩。何況是吊的不能再吊甲方。
借用jquery.from.js插件實現異步無刷新上傳文件。話說如果是自己去實現的話太麻煩了，這不是重點、重點是我不會。
工具：Jquery.js 、 jquery.form.js
思路：aspx頁面ajax提交文件給后臺ashx處理保存，處理后返回給前天一個處理結果。
詳細：前臺使用html兩個控件：一個是button另一個當然是丑到爆的file
1、拖入必須的兩個控件
<form id="fm1" method="post"> <input type="file" id="btnfile" value="提交" />
<input type="button" id="btn" value="上傳" />
</form>
2、 編寫JQuery，給button綁定當定單擊事件
$(function () { // 頁面加載完后觸發 $("#btn").click(function () { // id為btn的按鈕綁定單擊事件
$("#fm1").ajaxSubmit({
url: "UploadFileHandler.ashx",
type: "post",
success: function (data) {
alert(data);
}
});
});
})
3、后臺ashx處理文件并保存
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
// 獲取上傳的文件的對象
HttpPostedFile img = context.Request.Files["btnfile"];
// 獲取上傳文件的名稱
string s = img.FileName;
// 截取獲得上傳文件的名稱(ie上傳會把絕對路徑也連帶上，這里只得到文件的名稱)
string str = s.Substring(s.LastIndexOf("\\") + 1);
string path = "~/UploadFiles/" + str;
// 保存文件
img.SaveAs(context.Server.MapPath(path));
// HttpRuntime.AppDomainAppVirtualPath主要是獲取應用程序虛擬路徑名稱，因為響應給頁面時不會自動添加而導致無法顯示圖片
//context.Response.Write(HttpRuntime.AppDomainAppVirtualPath + path.Substring(1));//path.Substring(1)用來去除第一個~字符
context.Response.Write("提示：文件上傳成功！");
}
4、到此為止就可以實現異步上傳了，但是你會發現上傳4M以上的文件就會出錯。所以還需要在配置文件中修改一下文件最大值以及響應時間。
<httpRuntime targetFramework="4.5" maxRequestLength="1048576" executionTimeout="3600" />
|
|
QQ好友和群
QQ空間
騰訊微博
騰訊朋友
收藏
淘帖
頂
踩
