Javascript 如何使用切换（clickCount）功能更改多个图像，然后更改url_Javascript_Html_Switch Statement_Click Counting

Javascript 如何使用切换（clickCount）功能更改多个图像，然后更改url

javascript html

Javascript 如何使用切换（clickCount）功能更改多个图像，然后更改url,javascript,html,switch-statement,click-counting,Javascript,Html,Switch Statement,Click Counting,我试图找到一种方法来多次更改图像，然后导航到一个新的url；所有这些都是通过单击相同的按钮实现的。我一直在玩开关点击计数功能，从其他人的建议和我在其他地方读到的内容来看，这似乎是最好的解决方案然而，我以前从未使用过switch或clickCount，尽管阅读/观看了几篇教程，我还是无法让代码正常工作。但我不知道为什么我很确定我有限的知识很明显无法发现这一点，而且我已经在这个问题上纠缠了一个星期了，所以没有什么是有意义的了到目前为止我掌握的代码 HTML: JS: 输入类型=图像是一个提交按钮

我试图找到一种方法来多次更改图像，然后导航到一个新的url；所有这些都是通过单击相同的按钮实现的。我一直在玩开关点击计数功能，从其他人的建议和我在其他地方读到的内容来看，这似乎是最好的解决方案

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

到目前为止我掌握的代码

HTML:

JS:

输入类型=图像是一个提交按钮您没有将clickHandler附加到按钮试一试

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

<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>

<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>

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