Question

此问题与调用不同iframe代码中不同页面的html文件有关。有没有办法，使用javascript可能，检查页面是否有连接问题？如果是这样，尝试重新加载此帧直到建立连接。

要更清楚一点，如果您查看以下链接（http://tvgl.barzalou.com）（即使内容是法语，您会注意到页面的不同部分如何加载，而且往往是，正确加载）。但有一段时间，在周末期间，网络上的轻微连接问题到了，出于某种原因，框架发出了这个荒谬的灰色/浅灰色图标，表示存在连接问题。当然，当手动重新加载页面时，框架会恢复生机。

有人可以给我建议或建议吗？谢谢。

Answer 1

您可以安排一个代码来检查iframe是否正确加载

考虑一个样本

<script language="javascript">
     var attempts = 0;
     var maxattempt = 10;
     var intid=0;
     $(function()
     {
         intid = setInterval(function() 
         {

            $("iframe").each(function()
            {
               if(iframeHasContent($(this))) 
               {
                  //iframe has been successfully loaded
               }

               if(attempts < maxattempt)
               {
                 attempts++;
               }
               else
               {
                 clearInterval(intid);
               }
            })
         },1000);
     })

     function iframeHasContent($iframe)
     { 
         if($iframe.contents().find("html body").children() > 0)
         {
            return true; 
         }

         return false;
     }   
</script>

这个简单的代码段将检查文档中的iframe是否已正确加载。它将尝试10次尝试，然后将中止检查。

当检查中止时，您可以为每个iframe调用iframeHasContent（）以列出尚未加载的iframe，并在需要时重新加载它们。

从我的角度来看，这是一个想法，希望你会发现它很有用！

Answer 2

请检查更新的代码，该代码将在达到最大尝试次数后检查并重新加载iframe ...

<script language="javascript">
 var attempts = 0;
 var maxattempt = 10;
 var intid=0;
 $(function()
 {
     intid = setInterval(function() 
     {

        $("iframe").each(function()
        {
           if(iframeHasContent($(this))) 
           {
              //iframe has been successfully loaded
           }

           if(attempts < maxattempt)
           {
             attempts++;
           }
           else
           {
             clearInterval(intid);
             checkAndReloadIFrames();

           }
        })
     },1000);
 })

 function iframeHasContent($iframe)
 { 
     if($iframe.contents().find("html body").children() > 0)
     {
        return true; 
     }

     return false;
 }   

 function checkAndReloadIFrames()
 {
     $("iframe").each(function()
        {
            //If the iframe is not loaded, reload the iframe by reapplying the current src attribute
           if(!iframeHasContent($(this))) 
           {
               //reload iframes if not loaded 
               var $iframe = $(this);
               var src = $iframe.attr("src");
               //code to prevent cache request and reload url
               src += "?_" + new Date().getTime();

               $iframe.attr("src",src);
           }
        });
 }
 </script>

希望它有所帮助！

检测iframe中的连接问题

2 个答案: