iframe實現無重新整理上傳檔案
阿新 • • 發佈:2019-01-31
其實在ajax出現之前,web應用也可以是無重新整理的,那時大多通過IFrame來做到這一點。當然Ajax出現之後,人們一窩蜂地投奔Ajax 的陣營了,iFrame 就乏人問津了。但是用iFrame來實現無重新整理上傳檔案確實一個很好的選擇。
[html] view plaincopyprint?- <html>
- <body>
- <form action="upload.jsp" id="form1" name="form1" encType="multipart/form-data" method="post" target="hidden_frame" >
- <input type
- <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>
<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>
原理就是輸出一段js程式碼到 iframe 中,然後在iframe中來控制它的父頁面
[javascript] view plaincopyprint?- <%@ 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>");
- }
- %>
<%@ 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>");
}
%>