2016-05-31 94 views
0

我创建了一个script,它将一个iframe加载到父DOM中。 是这样的:Iframe内容会冻结?无效之后

var myIframe = createFrame("myIframe","http://foaas.com/awesome/mrstackoverflow") // Just an example 基本上做到这一点

function createFrame(id, link, style, modal){ 
    var iframe = document.createElement('iframe'); 
    iframe.frameBorder=0; 
    iframe.scrolling="no"; 
    iframe.setAttribute("frameborder", 0); 
    iframe.setAttribute("allowtransparency", true); 
    iframe.id=id; 
    iframe.setAttribute("src", link); 
    return iframe 
} 

,并添加到DOM与

var myScript = document.getElementById('myScript'); 
var parent = myScript.parentElement; 
parent.insertBefore(myIframe, myScript.nextSibling); 

所有这一切工作的...

我的问题是经过一段时间后,浏览器选项卡变为“无效”(?)

会出现这种情况? See image

屏幕方面,iframe内的内容是这样的冷冻的和错误(与我的其他选项卡的一些随机的部分。)喜欢看。 只有IFRAME但一旦我把它作为刷新什么都没有发生在DOM中做一些事情,一切都恢复到正常范围内。

到目前为止,从来就只遇到了的Mac和Safari此错误。

任何想法,这里是什么情况,什么什么我可以寻找那些可能会导致这样的事情?

我应该从哪里开始看?在脚本中或在iframe脚本中。两者都由我主持。它有可能是iframe.setAttribute("allowtransparency", true);

回答

0

制造没什么区别/无allow transparency

仍不能确定为什么这情况持续发生。 似乎该标签必须暂时停用一段时间才会发生。找到了解决方法,不是最优的。 刷新可见性更改的选项卡/窗口。

(function() { 
     var hidden = "hidden"; 

     // Standards: 
     if (hidden in document) 
      document.addEventListener("visibilitychange", onchange); 
     else if ((hidden = "mozHidden") in document) 
      document.addEventListener("mozvisibilitychange", onchange); 
     else if ((hidden = "webkitHidden") in document) 
      document.addEventListener("webkitvisibilitychange", onchange); 
     else if ((hidden = "msHidden") in document) 
      document.addEventListener("msvisibilitychange", onchange); 
     // IE 9 and lower: 
     else if ("onfocusin" in document) 
      document.onfocusin = document.onfocusout = onchange; 
     // All others: 
     else 
      window.onpageshow = window.onpagehide 
       = window.onfocus = window.onblur = onchange; 

     function onchange (evt) { 
      // refresh the iframe DOM or the container 
     } 
     if(document[hidden] !== undefined) 
      onchange({type: document[hidden] ? "blur" : "focus"}); 
    })();