iframe实现无刷新上传文件(转)
其实在ajax出现之前，web应用也可以是无刷新的，那时大多通过IFrame来做到这一点。当然Ajax出现之后，人们一窝蜂地投奔Ajax 的阵营了，iFrame 就乏人问津了。但是用iFrame来实现无刷新上传文件确实一个很好的选择。
[1].[代码] [HTML]代码
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
＜html＞ ＜body＞ ＜form action="upload.jsp" id="form1" name="form1" encType="multipart/form-data" method="post" target="hidden_frame" ＞ ＜input type="file" id="file" name="file" style="width:450"＞ ＜INPUT type="submit" value="上传文件"＞＜span id="msg"＞＜/span＞ ＜br＞ ＜font color="red"＞支持JPG,JPEG,GIF,BMP,SWF,RMVB,RM,AVI文件的上传＜/font＞ ＜iframe name='hidden_frame' id="hidden_frame" style='display:none'＞＜/iframe＞ ＜/form＞ ＜/body＞ ＜/html＞ ＜script type="text/javascript"＞ function callback(msg) { document.getElementById("file").outerHTML = document.getElementById("file").outerHTML; document.getElementById("msg").innerHTML = "＜font color=red＞"+msg+"＜/font＞"; } ＜/script＞ |
[2].[代码] 原理就是输出一段js代码到 iframe 中，然后在iframe中来控制它的父页面
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
|
＜%@ page language="java" contentType="text/html; charset=gb2312" %＞ ＜%@ page import="com.jspsmart.upload.SmartUpload"%＞ ＜% //新建一个SmartUpload对象 SmartUpload su = new SmartUpload(); //上传初始化 su.initialize(pageContext); // 设定上传限制 //1.限制每个上传文件的最大长度。 su.setMaxFileSize(10000000); //2.限制总上传数据的长度。 su.setTotalMaxFileSize(20000000); //3.设定允许上传的文件（通过扩展名限制）,仅允许doc,txt文件。 su.setAllowedFilesList("doc,txt,jpg,rar,mid,waw,mp3,gif"); boolean sign = true; //4.设定禁止上传的文件（通过扩展名限制）,禁止上传带有exe,bat,jsp,htm,html扩展名的文件和没有扩展名的文件。 try { su.setDeniedFilesList("exe,bat,jsp,htm,html"); //上传文件 su.upload(); //将上传文件保存到指定目录 su.save("c:\\"); } catch (Exception e) { e.printStackTrace(); sign = false; } if(sign==true) { out.println("＜script＞parent.callback('upload file success')＜/script＞"); }else { out.println("＜script＞parent.callback('upload file error')＜/script＞"); } %＞ |
