模拟126邮箱实现一次上传多个附件的例子

最新推荐文章于 2023-08-01 10:43:56 发布

原创最新推荐文章于 2023-08-01 10:43:56 发布 · 5.2k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #function #file #class #button #border

HTML/CSS 同时被 3 个专栏收录

3 篇文章

订阅专栏

ASP.Net

2 篇文章

订阅专栏

Javascript

2 篇文章

订阅专栏

本文介绍了一个ASP.NET中的文件上传示例，演示了如何使用客户端脚本限制上传文件类型为JPEG，并通过按钮触发文件选择对话框。同时，提供了如何在服务器端处理上传文件的方法。

最近,有好些网友问到类似的问题,我于是就做了个简单的例子，相信大家一看就明白。

有一点说明的是：对于file控件，必须点击他本身才可能完成对文件的上传，通过脚本打开选择文件对话框以后是无法再上传文件的，这也许是基于安全的考虑，即必须用户本人主观去上传本机的文件，否则本机文件有可能被脚本恶决上传。

我这里只充许上传jpg和gif图片，当然你可以根据需要自己修改。

请看示例：

<%@ Page Language="C#" AutoEventWireup="true" Codebehind="UpFile.aspx.cs" Inherits="csdn.UI.UpFile" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>文件列表</title> <mce:style></mce:style><style mce_bogus="1"> .attach { height:10px; border-left:solid 1px white; border-right:solid 1px gray; border-top:solid 1px white; border-bottom:solid 1px gray; background-color:#eeeef1; padding:0px; } .divFileInfo { width:400px; border:dotted 1px orange; height:150px; } .spText { position:relative; bottom:3px; padding-left:5px; padding-right:5px; } .myhelp { padding-left:0px; } .myhelp li { list-style:none; line-height:22px; padding-left:0px; } .divupload { font-size:12px; width:400px; background-color:White; border:solid 1px #336699; padding:10px; margin:auto; margin-top:100px; } td { font-family:@Tahoma; } .aclose { color:blue; } .aclose:hover { color:red; } body { margin:0; font-size:12px; } HTML,BODY,FORM { height:100%; } .inputfile { cursor:pointer !important; height:18px; left:-13px; filter:alpha(opacity=0); top:1px; width:1px; } .fileparent { background-image:url(https://p-blog.youkuaiyun.com/images/p_blog_youkuaiyun.com/cpp2017/EntryImages/20090806/addimg.jpg); background-repeat:no-repeat; display:block; float:left; height:20px; margin-top:-1px; position:relative; text-decoration:none; top:0pt; width:80px; } </style> <base target="_self" /> </head> <body> <form id="Form1" method="post" runat="server"> <input type="hidden" id="hidIds" runat="server"> <div id="divupload" class="divupload"> <div> <ul class="myhelp"> <li>说明：</li> <li>1、点击“添加图片”可以添加多个图片文件。</li> <li>3、点击“上传“可以将添加的图片批量上传到我的图片库。 </li> </ul> </div> <a id="divFileParent" class="fileparent" hidefocus="true" href="javascript:void(1==1);" mce_href="javascript:void(1==1);"> <input type="file" id="file1" size="1" class="inputfile" runat="server" onchange="javascript:SetValue(this)" /> </a> <br /> <div id="divFileInfo" class="divFileInfo"> </div> <div id="divFileList"> </div> <br /> <div style="text-align: center" mce_style="text-align: center"> <asp:Button ID="Button1" runat="server" CssClass="btn80" Text="上传" OnClientClick="javascript:return DoConfirmUp();" OnClick="btnUpLoad"></asp:Button> <input type="button" value="取消" class="btn" onclick="javascript:HideUpLoad();" /> </div> </div> </form> <mce:script language="javascript"></mce:script>

后台只是为了验证文件是否上传，至于保存相当简单就不多写了。

protected void btnUpLoad(object sender, EventArgs e) { for (int i = 0; i < Request.Files.Count; i++) { Response.Write(Request.Files[i].FileName+"<BR>"); //Request.Files[i].SaveAs(Path);如果要保存 } }