当前位置： 移动技术网 > IT编程>开发语言>.net > asp.net javascript 文件无刷新上传实例代码第1/2页

asp.net javascript 文件无刷新上传实例代码第1/2页

2017年12月12日  | 移动技术网IT编程  | 我要评论

双面公主vs假面王子,汤芳博客,邵嘉华


第二种方法：用js动态创建form和iframe上传文件，实现无刷新。优点是代码量小，无需客户端安装控件，缺点就是上传有限制大小，下面看代码：
需要文件有：1个前台页面upload.html、 1个js函数 function upfile、 1个处理文件accept.aspx(accept.aspx.cs)
upload.html
复制代码 代码如下:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script src="upload.js" src="upload.js" language="jscript" type="text/jscript"></script>
</head>
<body>
<form id="form1" runat="server">
<div style="width:100%">
<iframe name='hidden_frame' id="hidden_frame" style='width:150px; height:50px; display:none;'> </iframe>
<input type="file" id="hidfilepath" />
<input id="upbtn" type="button" class="clearbtn" style="display:none;" value="上传图片" onclick="upfile('hidfilepath');" />
</div>
</form>
</body>
</html>

function upfile
复制代码 代码如下:

function upfile(ob)
{
var file = document.getelementbyid(ob) ;
var newname = "filename"; //设置文件保存的名字

var form=document.createelement('form');
document.body.appendchild(form);
form.encoding="multipart/form-data";
form.method = "post";
form.action= "accept.aspx?nm=" + newname;
form.target= "hidden_frame";
var pos=file.nextsibling; //记住file在旧表单中的的位置
form.appendchild(file);
form.submit();
pos.parentnode.insertbefore(file,pos);
document.body.removechild(form);
}

accept.aspx
<%@ page language="c#" autoeventwireup="true" codefile="up.aspx.cs" inherits="member_up" %>
accept.aspx.cs
复制代码 代码如下:

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 member_up : system.web.ui.page
{
protected void page_load(object sender, eventargs e)
{
string mz = httpcontext.current.request.querystring["nm"].tostring();
string uperr = "";
httpfilecollection files = httpcontext.current.request.files;

if (files.count>0)
{ uperr = upsinglefile(files[0], mz); }
else { uperr = "ok"; }
httpcontext.current.session["upinfo"] = uperr;
response.write(uperr);
}


//上传文件
private string upsinglefile(httppostedfile file, string thefilename)
{
string infos = "";
bool fileok = false;

string filename, fileextension ;
filename = system.io.path.getfilename(file.filename);
if (filename != "")
{
if (file.contentlength >= 1024 * 1024 * 2)
{
infos = "上传文件太大，目前仅支持2m以内的图片上传！";
}
else
{
fileextension = system.io.path.getextension(filename).tolower();
string[] allowedextensions = { ".jpg", ".jpeg", ".gif", ".bmp", ".png", ".icon" };
for (int i = 0; i < allowedextensions.length; i++)
{
if (fileextension == allowedextensions[i])
{
fileok = true;
break;
}
}
if (!fileok)
{
infos = "不支持上传此类型文件！目前支持的图片格式有：jpg|jpeg|gif|bmp|png|icon";
}
else
{
file.saveas(system.web.httpcontext.current.request.mappath("~/books/bookpic/") + thefilename);
infos = "ok" + thefilename;
}
}
}
else
{
infos = "没有读取到文件！";
}
return infos;
}
}

以上为我写程序过程中遇到过的问题和探索到的解决方法，写下来一是自己在温习巩固一遍，二来是为了与大家分享，请大家指正需改进之处，以期达到共同进步！

2

12

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网