iframe实现无刷新上传文件(转)

it2022-05-24  58

其实在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>" );        }   %>  

转载于:https://www.cnblogs.com/quanfu2326/p/4299130.html

相关资源:asp.net中MVC借助Iframe实现无刷新上传文件实例

最新回复(0)