精华内容
下载资源
问答
  • 主要介绍了基于JS判断iframe是否加载成功的方法【多种浏览器】的相关资料,需要的朋友可以参考下
  • 主要介绍了通过js来判断iframe里的页面是否加载完成,需要的朋友可以参考下
  • 代码如下:var iframe = document.createElement(“iframe”); iframe.src = “//www.jb51.net”; if (!/*@cc_on!@*/0) { //if not IE iframe.onload = function(){ alert(“Local iframe is now loaded.”);...
  • 需要知道iframe何时加载完成,用JQuery很简单就能实现,具体如下,感兴趣的朋友可以参考下,希望对大家有所帮助
  • 主要介绍了JS判断iframe是否加载完成的方法,提供了2种实现方法,可分别针对IE内核与非IE内核浏览器进行判断与操作,涉及javascript事件操作与判定技巧,需要的朋友可以参考下
  • 一般来说,我们判断 iframe 是否加载完成其实与 判断JavaScript 文件是否加载完成。
  • 问题:帖子列表是ajax请求,一次性加载10条数据,采用超链接跳转详情页之后,再返回主页面,主页面的帖子列表需要重新请求,如果说用户已经看到第五页的帖子,点击详情,再次返回主页面时,帖子只会请求显示第一页...

    需要的效果如下:
    原文链接 原文链接
    贴吧类型的主页面,希望点击下面的帖子就可以看到帖子详情页,然后点击帖子上的返回按钮可以返回到点前浏览的地方。

    主页面如下:
    s.jf3q.com
    问题:帖子列表是ajax请求,一次性加载10条数据,采用超链接跳转详情页之后,再返回主页面,主页面的帖子列表需要重新请求,如果说用户已经看到第五页的帖子,点击详情,再次返回主页面时,帖子只会请求显示第一页数据,这样用户需要在再加载4次数据才能找到自己浏览的那个位置,用户体验太差了。

    寻找解决方法用iframe。实现效果如下:点击帖子链接,页面出现菊花,表示在请求详情页的数据
    s.jf3q.com
    数据加载完后,菊花隐藏,显示帖子详情,效果如下

    s.jf3q.com
    点击详情页的返回按钮,主页面的所有数据均在,并且显示在用户刚浏览的那条数据的位置。

    关键性代码如下:
    $("#detail iframe").load(function() {
    //加载完隐藏转动菊花的操作
    });

    主要思路:
    其实代码并不难,关键是思路。 主页面的显示和隐藏,以及用到了锚点链接。

    第一步,主页面和详情页功能已完成

    第二步:分别将主页代码和iframe用section标签包裹起来
    s.jf3q.com
    第三步,给帖子列表添加点击事件
    教你写技术
    ps,需要和自己定义的参数一样
    s.jf3q.com教你写技术
    这样,点击帖子列表就会显示菊花,加载完后显示详情页
    第四步,返回主页操作
    s.jf3q.com
    这个用起来很简单,但是需要思路清晰,用jq来控制页面元素的显示和隐藏,如果问题没有得到解决,可以加我扣扣1913284695 ,当然还有其他的方法,比如get请求也可以实现

    展开全文
  • 判断 iframe 是否加载完成的完美方法

    万次阅读 2016-04-06 11:37:32
    一般来说,我们判断 iframe 是否加载完成其实与 判断 JavaScript 文件是否加载完成 采用的方法很类似: var iframe = document.createElement("iframe"); iframe.src = "http://www.planabc.net"; if (!/...
    


    一般来说,我们判断 iframe 是否加载完成其实与 判断 JavaScript 文件是否加载完成 采用的方法很类似:

    var iframe  =  document.createElement( " iframe " );
    iframe.src 
    =   " http://www.planabc.net " ;
    if  (! /* @cc_on!@ */ 0 ) {  // if   not  IE    
        iframe.onload 
    =   function (){        
            alert(
    " Local iframe is now loaded. " );    
        };
    else  {    
        iframe.onreadystatechange 
    =   function (){//ie
            
    if  (iframe.readyState  ==   " complete " ){            
                alert(
    " Local iframe is now loaded. " );
            }
        };
    }
    document.body.appendChild(iframe);

    最近,  Nicholas C. Zakas  文章 《Iframes, onload, and document.domain》 的评论中 Christopher 提供了一个新的判断方法( 很完美 )
    var iframe  =  document.createElement( " iframe " );
    iframe.src 
    =   " http://www.planabc.net " ;
    if  (iframe.attachEvent){    
        iframe.attachEvent(
    " onload " function (){        
            alert(
    " Local iframe is now loaded. " );    
        });
    else  {    
        iframe.onload 
    =   function (){        
            alert(
    " Local iframe is now loaded. " );    
        };
    }
    document.body.appendChild(iframe);

    我自己的实例:
    < div class = " contentRight " >
                        
    < iframe name = " myframe "  id = " myframe "  src = ""  frameborder = " 0 "  scrolling = " no "  width = " 100% "  height = " 500 " ></ iframe >
                    
    </ div >  

    var  iframe  =  document.getElementById( " myframe " );
        iframe.src
    = " <%=request.getContextPath()%>/jsp/dwgl/hygl/zdhygl/dwgl_hygl_zdhygl_cx_part2.jsp " ;
        
    if  (iframe.attachEvent){
            iframe.attachEvent(
    " onload " function (){
                get_list_data_nopar();
             });
        }
    else {
            iframe.onload 
    =   function (){
                get_list_data_nopar();
            };
        }


    几点补充说明: 
    1、IE 支持 iframe 的onload 事件,不过是隐形的,需要通过 attachEvent 来注册。 
    2、第二种方法比第一种方法更完美,因为 readystatechange 事件相对于 load 事件有一些潜在的问题。 
    展开全文
  • vue判断iframe是否加载完毕

    千次阅读 2020-09-09 16:19:49
    <main> <...iframe v-show="completeLoad" :src="url" width="100%" id="license_iframe" height="100%"></iframe> </main> js mounted () { var _this = this const ifra

    html

    <main>
      <img v-show="!completeLoad" src="../images/loading.gif"/>
      <iframe v-show="completeLoad" :src="url" width="100%" id="license_iframe" height="100%"></iframe>
    </main>
    

    js

    mounted () {
    	var _this = this
    	const iframe = document.querySelector('#license_iframe')
    	// 处理兼容行问题
    	if (iframe.attachEvent) {
    		iframe.attachEvent('onload', function () {
    			console.log('iframe已加载完毕')
    			_this.completeLoad = true;
            })
        } else {
            iframe.onload = function () {
                console.log('iframe已加载完毕')
                _this.completeLoad = true;
            }
        }
    }
    
    展开全文
  • 方法一、jQuery load() var frm = document.getElementById('myiframe');...$(frm).load(function(){ // 等iframe加载完毕 dosomething(); }); 方法二、onreadystatechange var i...

    方法一、jQuery load()

    var frm = document.getElementById('myiframe');  
    $(frm).load(function(){                             //  等iframe加载完毕  
    dosomething();  
    });  

    方法二、onreadystatechange

    var iframe = document.createElement("myiframe");  
    iframe.src = "http://www.baidu.com";  
    if (!/*@cc_on!@*/0) { //如果不是IE,IE的条件注释  
        iframe.onload = function(){     
            alert("Local iframe is now loaded.");  
        };  
    } else {  
        iframe.onreadystatechange = function(){ // IE下的节点都有onreadystatechange这个事件  
            if (iframe.readyState == "complete"){  
                alert("Local iframe is now loaded.");  
            }  
        };  
    }  
    document.body.appendChild(iframe); 

    方法三、attachEvent

    var iframe = document.createElement("iframe");  
    iframe.src = "http://www.baidu.com";  
      
    if (iframe.attachEvent){  
        iframe.attachEvent("onload", function(){ // IE  
            alert("Local iframe is now loaded.");  
        });  
    } else {  
        iframe.onload = function(){ // 非IE  
            alert("Local iframe is now loaded.");  
        };  
    }  
      
    document.body.appendChild(iframe);  

     

    转载于:https://www.cnblogs.com/Tohold/p/10690180.html

    展开全文
  • //判断exportFrame业务是否加载完,并关闭遮罩层 var exportFrame = document.getElementById("exportFrame"); //获取iframe exportFrame.onreadystatechange = function(){ if(exportFrame.readyState == ...
  • 判断iframe是否加载完成

    千次阅读 2018-07-12 10:50:42
    if (iframe.attachEvent){ iframe.attachEvent("onload", function(){ alert("Local iframe is now loaded."); }); } else { iframe.onload = function(){ alert("Local iframe is ...
  • 判断iframe加载完成

    2010-07-04 11:42:54
    iframe如下: [code="java"][/code] javascript: [code="java"] function setVisiblity() { if(document.readTxt.document.readyState=="complete") { var k = d...
  • 判断 iframe 加载完成 获取其内容

    千次阅读 2017-05-05 17:09:29
    判断 iframe 加载完成 获取 iframe内容
  • 主要介绍了js判断iframe内的网页是否滚动到底部触发事件,需要的朋友可以参考下
  • 一般来说,我们判断 iframe 是否加载完成其实与 判断 JavaScript 文件是否加载完成 采用的方法很类似: var iframe = document.createElement("iframe"); iframe.src = "http://www.planabc.net"; if ...
  • 判断 iframe 是否加载完毕 方法、jQuery load() Js代码 varfrm=document.getElementById('myiframe'); $(frm).load(function(){//等iframe加载完毕 dosomething(); });...
  • 判断Iframe是否加载完毕,加载完毕后对Iframe上的元素进行修改
  • vue 监听iframe是否加载完毕

    万次阅读 2019-07-24 16:20:14
    1.html文件 <iframe src="https://guides.github.com" id="ifra" frameborder="0"></iframe> 2.vue 生命周期的 mounted 阶段 mounted () { ... const iframe = document.querySelector...
  • //添加一个加载事件 var iframe = document.getElementById("oneIframechart"); if (iframe.attachEvent) { iframe.attachEvent("onload", function () { document.getElemen...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 20,047
精华内容 8,018
关键字:

判断iframe加载完