[英]Load iFrame after page load
我有一个PHP页面,其中包含一些iFrame,导致页面加载速度相当慢。 一旦页面完全加载,我该如何才能加载那些iFrame? 我假设我需要使用JavaScript,但我还没有找到有效的代码。
非常感谢。
编辑 - iFrame需要出现在PHP回声中。
这是代码:
<?php
while($i = mysql_fetch_array($e))
{
?>
<div class='dhtmlgoodies_question'>
<div style='float:left'><img src='../images/categories/<?=$i[Category]?>.png'></div>
<div class='name'><?=$i[Name]?></div>
<div class='location'><?=$i[Area]?></div>
</div>
<div class='dhtmlgoodies_answer'>
<div>
<div style='background-color:#FFF; margin-left:248px; padding:10px; color:#666'>
<?=$i[Address]?><br>
<?=$i[Area]?><br>
<a href='http://maps.google.com/maps?q=<?=$i[Postcode]?>'><?=$i[Postcode]?></a><
<p>
<?=$i[ContactName]?><br>
<?=$i[TelephoneNumber]?>
</div>
<p>
<a href='http://crbase.phil-howell.com/view.php?Employer=<?=$i[Employer]?>'>
Edit this entry
</a>
<br>
//HERE IS WHERE I WANT TO LOAD THE iFRAME
</p>
</div>
</div>
</div>
<?php
}
?>
正如@Sudhir和@Richard所示,你可以通过延迟iframe
内容的加载来解决这个问题,它只需要一些javascript行。
但是,有时将iframe
元素放入源代码中更方便,而不是在运行时创建元素。 好吧,您也可以通过最初创建指向about:blank
的iframe
元素并在运行时更改其源来实现它:
<html>
<head>
<script>
function loadDeferredIframe() {
// this function will load the Google homepage into the iframe
var iframe = document.getElementById("my-deferred-iframe");
iframe.src = "./" // here goes your url
};
window.onload = loadDeferredIframe;
</script>
</head>
<body>
<p>some content</p>
<!-- the following iframe will be rendered with no content -->
<iframe id="my-deferred-iframe" src="about:blank" />
<p>some content</p>
</body>
</html>
为@PhilHowell编辑:我希望这个想法现在更加清晰。
尝试在身体末端添加:
window.onload = function() {
var iframe = document.createElement('iframe');
iframe.style.display = "none";
iframe.src = your_iframe_source_url;
document.body.appendChild(iframe);
};
如果您愿意,可以在页面加载后加载您的iframe:
我在这里使用jquery来简化:
$(function() {
$('<iframe />').attr('src', 'http://www.google.com').appendTo('#yourelementId');
});
在这里看到更多:
http://jquery-howto.blogspot.co.uk/2010/02/dynamically-create-iframe-with-jquery.html
所以对于PHP Echo:
<?php
echo "<div id='yourelementId'></div><script>$(function() { $('<iframe />').attr('src', 'http://www.google.com').appendTo('#yourelementId');});</script>";
?>
哦,确保你已经链接了jQuery或使用Sudhir给出的代码。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.