Javascript 常量脚本->；更改src iframe（1分钟、5分钟）和#x2B；jQuery

我在用jQuery编写脚本时遇到问题

我的页面中有一个需要更改的

iFrame

iframe的源必须是

http://www.example1.com

等待一分钟，然后切换到

http://www.example2.com

五分钟。这是一个常量循环。但是我该怎么做呢

我现在有：

jQuery(document).ready(function () {
    setTimeout(function() {
        if($('#iframe').attr('src') == "http://www.example1.com")
        {
            $('#iframe').attr('src',"http://www.example2.com");
        }
        else
        {
            $('#iframe').attr('src',"http://www.example1.com");
        }
    }, 10000);
});

---

但这没什么用。并且它只运行一次。

将iframe的初始

src

设置为

http://www.example1.com

和

jQuery(document).ready(function () {
   var runme = function() {
      var iframe = $('#iframe');

      setTimeout(function() { // first callback
         iframe.attr('src', 'http://www.example2.com');
      }, 1000 * 60);          // change to example2 after 1 minute

      setTimeout(function() { // second callback
         iframe.attr('src', 'http://www.example1.com');
         runme();             // loop
      }, (1000 + 5000) * 60); // change to example1 after 6 minutes (1 + 5)
   };

   runme();
});

此代码准备两个超时，一个回调函数在1分钟后执行，第二个回调函数在1+5=6分钟后执行。第二次回调“重新武装”这两个超时，以此类推

如果您不想设置initial

src

，代码可以写成

jQuery(document).ready(function () {
   var runme = function() {
      var iframe = $('#iframe');

      iframe.attr('src', 'http://www.example1.com');  // set to example1

      setTimeout(function() {
         iframe.attr('src', 'http://www.example2.com');
         setTimeout(runme, 5000 * 60); // repeat after 5 minutes 
      }, 1000 * 60);          // change to example2 after 1 minute
   };

   runme();
});

---

将iframe的初始

src

设置为

http://www.example1.com

和

jQuery(document).ready(function () {
   var runme = function() {
      var iframe = $('#iframe');

      setTimeout(function() { // first callback
         iframe.attr('src', 'http://www.example2.com');
      }, 1000 * 60);          // change to example2 after 1 minute

      setTimeout(function() { // second callback
         iframe.attr('src', 'http://www.example1.com');
         runme();             // loop
      }, (1000 + 5000) * 60); // change to example1 after 6 minutes (1 + 5)
   };

   runme();
});

此代码准备两个超时，一个回调函数在1分钟后执行，第二个回调函数在1+5=6分钟后执行。第二次回调“重新武装”这两个超时，以此类推

如果您不想设置initial

src

，代码可以写成

jQuery(document).ready(function () {
   var runme = function() {
      var iframe = $('#iframe');

      iframe.attr('src', 'http://www.example1.com');  // set to example1

      setTimeout(function() {
         iframe.attr('src', 'http://www.example2.com');
         setTimeout(runme, 5000 * 60); // repeat after 5 minutes 
      }, 1000 * 60);          // change to example2 after 1 minute
   };

   runme();
});

---

我相信这会奏效。每次调用其中一个函数时，它都会为另一个函数设置一个新的超时。首先显示1，然后设置1分钟超时。当该超时过期时，将显示2，并将新的超时设置为5分钟，此时将再次显示1

function show1() { 
    iframe.attr('src', 'http://www.example1.com');
    setTimeout(function() { show2(); }, 1000 * 60);
}
function show2() { 
    iframe.attr('src', 'http://www.example2.com');
    setTimeout(function() { show1(); }, 1000 * 60 * 5);
}

jQuery(document).ready(function() {
    show1();
});

---

我相信这会奏效。每次调用其中一个函数时，它都会为另一个函数设置一个新的超时。首先显示1，然后设置1分钟超时。当该超时过期时，将显示2，并将新的超时设置为5分钟，此时将再次显示1

function show1() { 
    iframe.attr('src', 'http://www.example1.com');
    setTimeout(function() { show2(); }, 1000 * 60);
}
function show2() { 
    iframe.attr('src', 'http://www.example2.com');
    setTimeout(function() { show1(); }, 1000 * 60 * 5);
}

jQuery(document).ready(function() {
    show1();
});

（函数（）{
var iframe=document.getElementById（'iframe'）
，urlA=http://www.example1.com'
，urlB=http://www.example2.com'
，a=60000
，b=300000
，delay=iframe.getAttribute（'src'）==urlA？delayA:delayB
，timeoutCallback=函数（）{
iframe.setAttribute（'src'，iframe.getAttribute（'src'）==urlA？urlB:urlA）；
延迟=延迟===延迟A？延迟B：延迟A；
//使用更新的延迟设置新超时
setTimeout（timeoutCallback，延迟）
};
//开始。
setTimeout（timeoutCallback，delay）；
}());
（函数（）{
var iframe=document.getElementById（'iframe'）
，urlA=http://www.example1.com'
，urlB=http://www.example2.com'
，a=60000
，b=300000
，delay=iframe.getAttribute（'src'）==urlA？delayA:delayB
，timeoutCallback=函数（）{
iframe.setAttribute（'src'，iframe.getAttribute（'src'）==urlA？urlB:urlA）；
延迟=延迟===延迟A？延迟B：延迟A；
//使用更新的延迟设置新超时
setTimeout（timeoutCallback，延迟）
};
//开始。
setTimeout（timeoutCallback，delay）；
}());
您还可以创建一个间隔回调，每100毫秒检查一次是否显示下一个内容。也许这比其他方法要复杂一点

但是，如果将其作为外部脚本包含，则只需3行代码即可加载所需的内容

作为iframe的替代方案，您还可以将外部文件加载到对象标记中。我在下面的演示中使用了它。您还可以找到与JSFIDLE相同的代码

如果您喜欢iframe，我已经在loadData函数中添加了它的代码作为注释

（我在演示中为每个内容设置了1分钟的时间，但可以根据您的喜好进行更改。）


var timedLoader=（函数（$）{
var tick=100；//100ms
var表示；
函数调度程序（）{
本附表=[]；
this.lastTick=（new Date（））.getTime（）；
this.currentTask=0；
此.currentDuration=0；
这个值=0；
那=这个；
这个.startTaskRunner（）；
}
Scheduler.prototype.startTaskRunner=函数（）{
setInterval（this.taskRunner，勾选）；
};
Scheduler.prototype.taskRunner=函数（）{
//经过的时间
var now=（new Date（））.getTime（）；
that.appeased=now-that.lastTick；
var sched=that.schedule；//引用schedule以缩短代码
如果（附表长度>0）{
//至少有一个任务可用
如果（即.currentDuration==0）{
that.currentDuration=sched[that.currentTask].displayTime*60*1000；//缩放到毫秒
log（'start duration='+that.currentDuration）；
console.log（'task='+that.currentTask）；
loadData（sched[that.currentTask].url）；
}
其他的
{
that.currentDuration-=that.passed；
//console.log（即.currentDuration）；
如果（that.currentDuration sched.length-1）that.currentTask=0；
}
}
}
that.lastTick=now；//将新文件复制到旧文件
};
//时间（分钟）
Scheduler.prototype.addTask=函数（url、时间）{
this.schedule.push（{'url'：url，'displayTime'：time}）；
};
var loadData=函数（src）{
$（'#container'）.html（''）；
//$（'#container'）.html（''）；
};
返回{
loadData:loadData，
调度程序：调度程序
};
})（jQuery）；
$（函数（）{
//timedLoader.loadData（'http://www.example.com/');
var loader=new timedLoader.Scheduler（）；//启动和初始化调度器
loader.addTask（'http://www.example.com/“，1）；//要加载的url，时间（分钟）
loader.addTask（'http://www.example1.com/', 1);
//装载