Jquery手风琴内的iFrame

我有一个内嵌JQuery手风琴的iFrame页面。Jquery手风琴内的iFrame

JS：

$(function() { 
       $("#doc_accordion").accordion(); 
     });

HTML：

<div id="doc_accordion"> 
        <h3><a href="#">1</a></h3> 
        <div> 
        <iframe src="http://test.com/view.do?url=http://test2.com/xyz" style="width:600px; height:500px;" frameborder="0"></iframe> 
        </div> 
        <h3><a href="#">TESTING</a></h3> 
        <div> 
          <p>TESTING2</p> 
        </div> 
      </div>

出于某种原因，我不能看到嵌入的iFrame但我可以看到手风琴。另外，如果我删除行$("#doc_accordion").accordion()，那么我可以看到正确嵌入页面中的iFrame。有没有人遇到类似的问题？

来源

2010-02-18 kartikq

的选项可能会使用以下内容：

$(document).ready(function() { 
    $("#doc_accordion").accordion(); 
});

据我所知手风琴隐藏未显示的元素，这可能与页面的加载到iframe干扰。

来源

2010-02-18 19:30:52 AxelEckenberger

我只是去尝试，我也得到了同样的答复。 – kartikq 2010-02-18 19:37:54

http://stackoverflow.com/questions/205087/jquery-ready-in-a-dynamically-inserted-iframe可能会提供一个解决方案。 – AxelEckenberger 2010-02-18 19:59:56

尝试了一些来自该线程的方法。似乎没有工作。 – kartikq 2010-02-18 20:43:08

我测试了您的代码&在Firefox中看起来很好& Mac上的Safari和PC上的IE7。我可以正确地看到iframe。这可能是浏览器或CSS问题？

您是否试过声明宽度为&的div标签的高度？您可以使用click（）函数进行设置。但同时尝试手动为div标签添加'style =“width：600px; height：500px;”'以测试它。

它也可能与你正在使用的jQuery脚本有关。我用这两个JS脚本head标签内：

<script type="text/javascript" src="jquery-1.3.2.js" ></script> 
<script type="text/javascript" src="jquery-ui-1.7.2.custom.min.js" ></script>

我即将开始手风琴&自己的IFrame（因此利息）试验...

来源

2010-02-19 11:12:02 WastedSpace

我相信这是因为IE浏览器不会渲染隐藏元素的孩子。作为一种解决方法，您可以在手风琴外部加载1px×1px的iframe，并在iframe加载后将其移入手风琴中。这里有一个例子：

<div id="widget-box"> <!-- Accordion --> 
    <h3><a href="#">Widget</a></h3> 
    <div id="widget-placeholder">    
    </div> 
</div> 

<iframe id='widget-frame' style="height:1px; width:1px;" src='widget.html'></iframe> 

<script type="text/javascript"> 
    $(function() { 
     $("#widget-box").accordion({ 
      collapsible: true, 
      autoHeight: false, 
      active: false 
     }); 
     $('#widget-frame').load(function() { 
      if ($("#widget-placeholder > iframe").size() == 0) { 
       $('#widget-placeholder').append($('#widget-frame')); 
      } 
      this.style.height = this.contentWindow.document.body.offsetHeight + 'px'; 
      this.style.width = '100%'; 
     }); 
    }); 
</script

来源

2012-02-16 18:03:32 kkhimself

Jquery手风琴内的iFrame

回答

相关问题