0

我试图找到一种方法来多次更改图像,然后导航到新的 url;所有通过单击相同的按钮。我一直在玩一个开关(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>
4

1 回答 1

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

尝试

<button type="button" onclick="clickHandler()"><img 
src="silvercogarrow.png" alt="Enter" /></button>
于 2018-11-24T22:15:53.760 回答