如何使用switch(clickCount)函数改变多张图片然后改变url

How to use a switch (clickCount) function to change multiple images then change url

我正在尝试找到一种方法来多次更改图像,然后导航到新的 url;全部通过单击相同的按钮。我一直在玩一个 switch (clickCount) 函数,从其他人的建议和我在其他地方读到的内容来看,这似乎是最好的解决方案。

但是,我以前从未使用过 switch 或 clickCount,尽管 reading/watching 有几个教程,但我还是无法使代码正常工作。但我不知道为什么(我很确定这是非常明显的,我有限的知识未能发现)而且我已经在这个问题上停留了一个星期了,所以没有任何意义了!

我目前的代码...

HTML:

<body>
<div id="wrapper" div class="toshow">
    <img src="infoscreenarrows.jpg" alt="Title" />
    <img src="infoscreentext.png" id="infoscreentext" alt="" />
</div>

<div id="enterbutton">
    <input type=image id=multiclick img src="silvercogarrow.png" alt="Enter" >
</div>
</body>

JS:

<script>
var clickCount = 0;

function clickHandler () {
    clickCount += 1;
    switch (clickCount) {
    case 1:
        var image = document.getElementById("infoscreentext");
        image.src="infoscreentext2.png";
        // 1st click on SilverCogArrow changes image infoscreentext to infoscreentext2
    break;
    case 2:
        var image = document.getElementById("infoscreentext");
        image.src="infoscreentext3.png";
        // 2nd click on SilverCogArrow changes image infoscreentext2 to infoscreentext3
    break;
    case 3:
        window.location.href = "castleview.html";
        // 3rd click on SilverCogArrow changes page to castleview.html
break;
  }
}
</script>
  1. input type=image 是一个提交按钮
  2. 您没有将 clickHandler 附加到按钮

尝试

<button type="button" onclick="clickHandler()"><img 
src="silvercogarrow.png" alt="Enter" /></button>