当我们做后台管理页面通常需要做一个文件上传，但是如果多个页面上传的时候我们会去做一个一个的上传代码吗？如果你还是，那么 oh shit !
我的思路是做一个上传文件功能的页面，然后用iframe将当前上传页面嵌套进来，然后在上传页面做一个上传成功时候将上传的url用javascript通知window.openner对象页面的值。
html页面如下Yeml_File_Upload
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> </head> <body><iframe src="Yeml_File_Upload.aspx" width="100%" height="30" frameborder="0"> </iframe> </body> </html>
.aspx
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>文件上传</title> </head> <body> <form id="form1" runat="server"> <!-- author:叶明龙 createTime:2013-08-08 descript:上传成功,将图片所在的根目录的返回在本页面的隐藏域中，便于window.opener访问本页面的上传路径。 客户端生成了upladSucess(upoad_url)函数，可直接在parent页面直接调用本页面的upoad_url。 --> <asp:FileUpload ID="file_upload" runat="server" /> <asp:Button ID="btn_upload" runat="server" Text="上传" OnClick="btn_upload_Click" /> <input type="hidden" id="hidd_upoad_url" runat="server" /> </form> </body> </html>
protected void btn_upload_Click(object sender, EventArgs e) { // String path = Server.MapPath("~/UploadedImages/"); if (file_upload.HasFile) { bool fileOK = false; String fileExtension = Path.GetExtension(file_upload.FileName).ToLower(); String[] allowedExtensions = { ".gif", ".png", ".jpeg", ".jpg" }; for (int i = 0; i < allowedExtensions.Length; i++) { if (fileExtension == allowedExtensions[i]) { fileOK = true; } } if (!fileOK) { return; } string path = string.Format("/UploadImages/jhrz_images/{0}/", DateTime.Now.ToString("yyyyMMdd")); if (!Directory.Exists(Server.MapPath("~" + path))) Directory.CreateDirectory(Server.MapPath("~" + path)); string file_name = string.Format("{0}{1}{2}", path, Guid.NewGuid(), fileExtension); file_upload.SaveAs(Server.MapPath(file_name)); hidd_upoad_url.Value = file_name; ClientScript.RegisterStartupScript(GetType(), "upload_success", "<script type='text/javascript'>parent.upladSucess('" + file_name + "');</script>", false); } }
例如是1.html
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script type="text/javascript"> /** *图片上传成功callback */ function upladSucess(img_url) { // alert(img_url); document.getElementById("img1").setAttribute("src",img_url); } </script> </head> <body> <img id="img1" src="" /> <iframe src="Yeml_File_Upload.aspx" width="100%" height="30" frameborder="0"> </iframe> </body> </html>
剩下如果还有2.html,3.html,**.aspx需要上传文件的时候我们只需要在每个页面重写
/** *图片上传成功callback */ function upladSucess(img_url) { // alert(img_url); document.getElementById("img1").setAttribute("src",img_url); }
来逻辑我们的页面赋值操作就好了！