Javascript倒数计时器来更改图像和链接

Javascript countdown timer to change image and link

本文关键字：图像 链接 倒数 计时器 Javascript      更新时间：2023-09-26

提前道歉，因为我在这里有点不了解。

我正在尝试在ASP页面上使用JavaScript倒数计时器执行以下操作 - 页面加载后每六十秒，基于图像的链接将在五个图像/链接组合之一之间切换。

我

在这里做错了什么，我找不到问题所在。 它永远不会运行。

提前感谢任何帮助。

这些图像命名如下：

  • 1_AdvoImg.gif 2_AdvoImg.gif 3_AdvoImg.gif 4_AdvoImg.gif 5_AdvoImg.gif

网址如下：

  • 链接一.html链接二.html链接三.html链接四.html链接五.html

封装链接的 html 是这样的：

<a id='AdvoLink' href='../'><img id='AdvoImg' src='' border="0"></a>

javascript是这样的：

<script language="javascript">
    function startTimer(duration) {
        var timer = duration, seconds, imgprefix, imgname, linkurl;
        imgprefix = 1;
        setInterval(function () {
            seconds = parseInt(timer % 60, 10);
            imgname = imgprefix.concat("_AdvoImg.gif");
            if (imgprefix == 1) {
                linkurl = "linkone.html";
            }
            if (imgprefix == 2) {
                linkurl = "linktwo.html";
            }
            if (imgprefix == 3) {
                linkurl = "linkthree.html";
            }
            if (imgprefix == 4) {
                linkurl = "linkfour.html";
            }
            if (imgprefix == 5) {
                linkurl = "linkfive.html";
            }
            if (--timer <= 0) {
                document.getElementById("AdvoLink").href = "";
                document.getElementById("AdvoImg").src = imgname;
                ++imgprefix;
                timer = duration;
            }
        }, 5);
    }
    window.onload = function () {
        startTimer(60);
    };
</script>

您正在尝试在计时器内构建一个计时器。尽量保持简单。 您真正需要的只是：

window.onload = function () {
  setInterval(function () {
    //your url changing magic here - without the timer stuff
  }, 60000); 
};

有了这个，你的魔术代码应该每 60000 毫秒 => 60 秒 => 1 分钟触发一次。您实际上可以通过在循环中使用 console.log（） 来"调试"它。

不知道

你用var秒做什么，所以我删除了它

编辑以阻止图像编号超过 5，将 if 循环更改为您需要的任何数字

function startTimer(duration) {
  
        var timer = duration;var seconds;var imgprefix;var imgname;var linkurl;
        imgprefix = 1;
    
  
   
        setInterval(function() {
      
     
       
            imgname = imgprefix+"_AdvoImg.gif";
            if (imgprefix == 1) {
                linkurl = "linkone.html";
            }
            if (imgprefix == 2) {
                linkurl = "linktwo.html";
            }
            if (imgprefix == 3) {
                linkurl = "linkthree.html";
            }
            if (imgprefix == 4) {
                linkurl = "linkfour.html";
            }
            if (imgprefix == 5) {
                linkurl = "linkfive.html";
            }
document.getElementById("timer").innerHTML=timer;
              timer--;
            if (timer <= 0) {
                document.getElementById("AdvoLink").href = linkurl;
                document.getElementById("AdvoImg").src = imgname;
              document.getElementById("result").innerHTML = "image src = "+imgname+" and href = "+linkurl;
                if(imgprefix < 5){++imgprefix;}else{imgprefix =1;}
                timer = duration;
            }
        }, 200//speed up and slow down here, in milliseconds
                   );
    }
    window.onload = function () {
        startTimer(10);
    };
<a id='AdvoLink' href='../'><img id='AdvoImg' src='' border="0"></a>
<div id="timer"> </div>
<div id='result'> </div>

相关文章：