Question

我想创建一个java脚本，它每隔5秒自动遍历我的函数，这是我的代码

function showlisten() {
   document.getElementById('listen').style.display = "block";
   document.getElementById('review').style.display = "none";
   document.getElementById('earn').style.display = "none";
   document.getElementById('listen-text').style.display = "block";
   document.getElementById('review-text').style.display = "none";
   document.getElementById('earn-text').style.display = "none";
}
function showreview() {
   document.getElementById('listen').style.display = "none";
   document.getElementById('review').style.display = "block";
   document.getElementById('earn').style.display = "none";
   document.getElementById('listen-text').style.display = "none";
   document.getElementById('review-text').style.display = "block";
   document.getElementById('earn-text').style.display = "none";
}
function showearn() {
   document.getElementById('listen').style.display = "none";
   document.getElementById('review').style.display = "none";
   document.getElementById('earn').style.display = "block";
   document.getElementById('listen-text').style.display = "none";
   document.getElementById('review-text').style.display = "none";
   document.getElementById('earn-text').style.display = "block";
}

Answer 1

非常简单。

var clearToken = window.setInterval(function () {
    showlisten(); showreview(); showearn();
}, 5000);

感谢QuickSilver博士发现需求的真实性质。更新如下：

function showlisten(){
    document.write("listen<br />");
}
function showreview(){
    document.write("review<br />");
}
function showearn(){
    document.write("earn<br />");
}

showlisten();
window.setInterval(function () {
    showlisten();
}, 15000);
window.setTimeout(function () {
    showreview();
    window.setInterval(function(){
        showreview();        
    }, 15000);
}, 5000);
window.setTimeout(function () {
    showearn();
    window.setInterval(function () {
        showearn();
    }, 15000);
}, 10000);

我更喜欢QuickSilver的方法，但重复这种风格是多余的，所以我采用了不同的方法来为你提供两种方法。

我为它创建了一个小提琴，但该网站似乎正在为我播放：http://jsfiddle.net/jdjE5/希望该链接适合您。

Answer 2

你想让它处于'监听'状态5秒，然后'复查'状态持续5秒，然后'获得'状态持续5秒，然后循环？

如果是这样，您需要一个包含3个setTimeouts的链：

function dolisten() {
   showlisten();
   setTimeout(doreview,5000);
}
function doreview() {
   showreview();
   setTimeout(doearn,5000);
}
function doearn() {
   showearn();
   setTimeout(dolisten,5000);
}

你也可能在15秒的时钟上有3个不相关的setIntervals，但我不确定它们是否会保持同步，而且实际上并不简单。

Answer 3

你正在寻找setInterval（）;）

Answer 4

我应该缓存DOM元素，如：

function loopFunctions(){
   var elemListen = document.getElementById('listen'),
      elemReview = document.getElementById('review'),
      elemEarn = document.getElementById('earn'),
      elemListenText = document.getElementById('listen-text'),
      elemReviewText = document.getElementById('review-text'),
      elemEarnText = document.getElementById('earn-text'),
      functions = [
         function(){
            elemListen.style.display = "block";
            elemReview.style.display = "none";
            elemEarn.style.display = "none";
            elemListenText.style.display = "block";
            elemReviewText.style.display = "none";
            elemEarnText.style.display = "none";
         },
        function(){
            elemListen.style.display = "none";
            elemReview.style.display = "block";
            elemEarn.style.display = "none";
            elemListenText.style.display = "none";
            elemReviewText.style.display = "block";
            elemEarnText.style.display = "none";
         },
         function(){
            elemListen.style.display = "none";
            elemReview.style.display = "none";
            elemEarn.style.display = "block";
            elemListenText.style.display = "none";
            elemReviewText.style.display = "none";
            elemEarnText.style.display = "block";
         } 
      ],
      idInterval = setInterval(function(){
         for (var i = functions.length; i >= 0; i--) {
            functions[i]();
         };
      }, 5000);
}

循环功能

4 个答案: