如何使用开关（clickCount）功能更改多个图像然后更改 url答案

【问题标题】：How to use a switch (clickCount) function to change multiple images then change url如何使用开关（clickCount）功能更改多个图像然后更改 url
【发布时间】：2018-11-24 22:11:44
【问题描述】：

我正在尝试找到一种方法来多次更改图像，然后导航到新的网址；全部通过单击相同的按钮。我一直在玩一个开关（clickCount）功能，这似乎是其他人建议的最佳解决方案以及我在其他地方阅读的内容。

但是，我以前从未使用过 switch 或 clickCount，尽管阅读/观看了几篇教程，但我无法让代码正常工作。但我不知道为什么（我很确定我有限的知识未能发现这一点非常明显）而且我已经在这个问题上停留了一个星期，所以没有任何意义了！

我目前的代码...

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>

【问题讨论】：

标签： javascript html switch-statement click-counting

【解决方案1】：

input type=image 是一个提交按钮
您没有将 clickHandler 附加到按钮

试试

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

【讨论】：

我爱你！你可以带走我的长子！