延迟

时间:2017-05-18 19:32:16

标签: jquery wordpress iframe load delay

我在Wordpress页面上有两个iFrame,它每10秒自动刷新一次,我想将它们刷新的时间缩短5秒。我提出了在页面加载时加载一个iframe的想法,并在延迟5秒后加载第二个iframe。

到目前为止,以下代码等待5秒钟显示第二个iframe,但它们仍然会同时刷新。

我一整天都在这上班,我觉得我错过了一些非常简单的事情。

<iframe width="100%" id="delayFrame" src="http://example.com"></iframe>

这是jQuery:

jQuery(function($){
jQuery("#delayFrame").slideUp(300).delay(5000).fadeIn(400);  });

以下是iFrame用于刷新的代码,位于源文件本身:

<script type="text/javascript">
$(document).ready(function() {
    var refreshId = setInterval(function() {
    var fadeInData = function fadeInData() { $("#responsecontainer").fadeIn(); }
    var delaydata = function delayData(){$("responsecontainer").delay('5000');}
    var loadData = function loadData() { $("#responsecontainer").load('display.php', fadeInData); }
    $("#responsecontainer").fadeOut(loadData);
    }, 10000);
$.ajaxSetup({ cache: false });


});

1 个答案:

答案 0 :(得分:0)

我能够在一些帮助下解决这个问题,所以我正在回答我自己的问题。

如果iframe文件在文件内部有.setTimeout函数,则文件本身需要在与页面其余部分不同的时间加载,最简单的方法是切换源文件。 iframe中。

这是HTML:

<IFRAME id="delayFrame" src="" width="100%" height="500 style="display:none;">
</IFRAME>

和jQuery:

jQuery(function($){
 setTimeout(
  function()
  { 
  jQuery('#delayFrame').css("display", "block"); 
  jQuery('#delayFrame').attr('src','http://example.com');
   }, 5000);
 });

现在显示样式从&#34; none&#34;切换到&#34;阻止&#34; 5秒后,然后iframe更改了源,因此iFrame的.setTimeout 内部从头开始。