我的图片赢得了't显示

My images won't show

本文关键字：显示 我的      更新时间：2023-09-26

当我试图加载此页面时，我的图像不会显示！我正在尝试制作一个红绿灯序列（英国），当按下变灯按钮时，它会显示所有颜色！

<!DOCTYPE html>
<html>
<body>
<h1><u><b>Changing Traffic Lights</b></u><h1>
<button type="button" onClick="changeLights()"> Change Lights </button>    <!-- Creates a button to change the lights with -->
<img id ="trafficlight" src="red.jpg"></img>   <!-- Creates the first visible image on the page and gives it an ID so it can be called up later -->
<script>
var trafficlights = ["red-amber.jpg","green.jpg","amber.jpg","red.jpg"]  //creates an array for the lights
var currentlight = 0 //Creates a counter variable
function changeLights () {         //Calls up a function and designs it
    document.getElementById("trafficlight").src=trafficlights[currentlight]  //Calls up the image and enables it to be changed
    currentlight=currentlight+1   //Adds one to the counter
    if (currentlight>3){
        currentlight=0
    }
}
</script>
</body>
</html>

您的代码可以正常工作。但是您的图像源路径一定有问题。因为当我将图像更改为像lorempixel这样的远程图像时，这是正确的。

在这里工作。

尝试修复JS中的图像路径。祝你好运

var trafficlights = ["http://lorempixel.com/100/100","http://lorempixel.com/100/90","http://lorempixel.com/100/100","http://lorempixel.com/100/110"]
相关文章：