iframe加载完成事件

最新推荐文章于 2024-09-11 21:57:53 发布

0x77786e

最新推荐文章于 2024-09-11 21:57:53 发布

阅读量5.7k

点赞数

分类专栏： Javascript

Javascript 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

load方法介绍：

$(selector).load(function)

参数描述
function 必需。规定当指定元素加载完成时运行的函数。

当指定的元素（及子元素）已加载时，会发生 load() 事件。
该事件适用于任何带有 URL 的元素（比如图像、脚本、框架、内联框架）。
根据不同的浏览器（Firefox 和 IE），如果图像已被缓存，则也许不会触发 load 事件。
* 还有一个load方法，是通过ajax访问获取数据的
load(url,data,function(response,status,xhr))

参数	描述
function	必需。规定当指定元素加载完成时运行的函数。

iframe先模拟登陆再加载另一个页面的例子：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>页面跳转中...</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <meta content="text/html; charset=utf-8" http-equiv=Content-Type> 
    <script src="_files/jquery.js"></script>
    <script type="text/javascript">
        /*window.onbeforeunload = onbeforeunload_handler;
        function onbeforeunload_handler() {
            window.opener.location.reload();
            var warning = "确认退出?";
            return warning;
        }*/
         window.onbeforeunload =function(){
            window.opener.location="javascript:reloaddblist('OASYS');";
         }

        $(function(){   
            $("#login").load(function(){  
                $("#wait").css("display","none");
                var url = "${ospredirecUrl}"; 
                $("#main").attr("src",url).css("display","block");
            });   
        });   
    </script>

    <script language=JavaScript> 
        var url = "http://xxxxxxx/login?action=doit"+"&loginname="+"${username}"+"&password="+"${password}";
        var p=0,j=0; 
        var c=new Array("lightskyblue","white") 

        setInterval('proccess();',50) 

        function proccess(){ 
            document.forms.proccess.elements[p].style.background=c[j]; 
            p+=1; 
            if(p==30){
                p=0;j=1-j;
            }
        } 
    </script> 
    <style>
        .proccess { 
            background: #eee; border: 0px solid; height: 10px; margin: 3px; width: 10px 
        } 
    </style> 

  </head>

  <body style="OVERFLOW: hidden; OVERFLOW-Y: hidden"><!-- onload="loaded()" -->
  <iframe id="login" src="http://oa.sipc.cn/names.nsf?login&username=${username}&password=${password}" style="display: none"></iframe>
  <iframe id="main" style="width: 100%;height: 96%;display: none;border-style: none;margin: 0px;padding: 0px;"></iframe>
  <div id="wait" align=center> 
        <table align=center height="70%" valign="middle"> 
            <tbody> 
                <tr> 
                    <td align=middle><p></p> 
                    <!-- Displaytext--> 
                    <P></P> 
                    <font class=fontbig style='font-size:20px'>数据加载中..... 
                    <!--End Displaytext--> 
                        <P></P> 
                        <P></P> 
                        <P></P> 
                        <P></P> 
                        <div align=center> 
                            <form method=post name=proccess> 
                                <script language=javascript> 
                                    for(i=0;i<30;i++)document.write("<input class=proccess>") 
                                </script> 
                            </form> 
                        </div> 
                    </font></td> 
                </tr>
            </tbody>
        </table> 
    </div> 
  </body>
</html>