最近在上班时间看了一堆JQuery的插件,突然想把看到喜欢的插件一个个试着写个Demo,于是试着写了个ajaxfileupload的例子
看了一遍官网提供的例子,很快就写了出来,下面是大概的代码:
ajaxfileupload.aspx:
1
<script type="text/javascript">
2 //ajaxfileupload.js
3
function doajaxFileUpload()
{
4
$("#loading")
5
.ajaxStart(function(){
6 $(this).show();
7
})
8 .ajaxComplete(function(){
9 $(this).hide();
10 });
11 $.ajaxFileUpload({
12 url: "ajaxfileupload.aspx",
13 secureuri: false,
14 fileElementId: "fileupload",
15 dataType: "json",
16 success: function(data,status){
17 if(typeof(data.error) != 'undefined')
18 {
19 if(data.error != '')
20 {
21 alert(data.error + "sss");
22 }else
23 {
24 alert(data.msg + "aaa");
25 }
26 }
27 },
28 error: function (data, status, e)
29 {
30 alert(e + "99s");
31 }
32 });
33 </script>
34
<div>
请上传一个文件:
<br />
<div id="loading">
<img alt="" style="display:none;" src="resource/images/loading.gif" /></div>
<input type="file" id="fileupload" name="fileupload" accept="doc" />
<button id="upload" onclick="return doajaxFileUpload();" value="上传"></button>
</div>
<!--注意,由于用了模板页,所以只帖出用到的代码--->
后台代码:
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class ajaxfileupload : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
HttpFileCollection files = Request.Files;//这里只能用<input type="file" />才能有效果,因为服务器控件是HttpInputFile类型
string msg = string.Empty;
string error = string.Empty;
if (files.Count > 0)
{
files[0].SaveAs(Server.MapPath("~/images") + System.IO.Path.GetFileName(files[0].FileName));
msg = " 成功! 文件大小为:" + files[0].ContentLength;
string res = "{ error:'" + error + "', msg:'" + msg + "'}";
Response.Write(res);
Response.End();
}
}
}
小弟刚出道,只为学习之用,适用菜鸟的参考,有什么不对的地方,请指出...呵呵