Question

当我点击按钮时，我正在尝试创建通过红绿灯序列的代码。我知道有很多人有同样的问题，但他们得到的解决方案似乎都没有工作 - 我只能在网页上显示第一个资产（红色交通信号灯），当我点击按钮时没有任何反应..也许我只需要我的代码校对阅读，有一些非常明显我犯了错误的东西？这是我的代码：

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Task 3</h1>
    <img id="image" src="red.png" style="width:200px">
    <input type="button" onclick="nextpic()" value="change image" >

<script>
var image = document.getElementById("image");
var counter = 0;
var trafficlights = [
    "redamber.png",
    "amber.png",
    "green.png",
    "red.png"
];
function nextpic(){
    counter =counter+1;
    if (counter == trafficlights.length){
        counter = 0;
    }
    image.src = trafficlights[counter];
}

</script>
</body>
</html>

使用计数器/索引循环浏览图像数组

0 个答案: