我是一名学生,我的 HTML 代码遇到了问题。我的任务是使用代码中的数组创建交通灯序列,每次单击按钮后都会推进交通灯序列。它通过操作网页上的单个图像来实现这一点。
但是,按下按钮后,它只会将灯光更改为'RedAmberLight'
状态。代码已粘贴在下面,我们将不胜感激任何帮助:
<!DOCTYPE html>
<html>
<body>
<h1>Changing Traffic Lights w/ Arrays</h1>
<img id="trafficLight" src="RedLight.jpg">
<button type="button" onclick="lightChange()">Change Traffic Lights</button>
<script>
var fileArray = ["RedLight.jpg",
"RedAmberLight.jpg",
"GreenLight.jpg",
"AmberLight.jpg"];
function lightChange() {
var lightColour = trafficLight.src
if (lightColour = fileArray[0]) {
lightColour = fileArray[1];
} else if (lightColour = fileArray[1]) {
lightColour = fileArray[2];
} else if (lightColour = fileArray[2]) {
lightColour = fileArray[3];
} else {
lightColour = fileArray[0];
}
var light = document.getElementById('trafficLight');
light.src = lightColour
}
</script>
</body>
</html>
最佳答案
您需要使用 ==
或 ===
运算符而不是 =
来比较值。否则,您只需分配值并测试结果是“假”还是“真”(JavaScript 概念,用于测试空字符串、0 等或不是)。
if (lightColour === fileArray[0]) {
lightColour = fileArray[1];
} else if (lightColour === fileArray[1]) {
lightColour = fileArray[2];
} else if (lightColour === fileArray[2]) {
lightColour = fileArray[3];
} else {
lightColour = fileArray[0];
}
关于javascript - 为什么我的代码总是选择相同的数组项?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43572260/