javascript交通灯自动化_Javascript_Html

javascript交通灯自动化

javascript html

javascript交通灯自动化,javascript,html,Javascript,Html,我试图用3秒钟的定时器来自动控制交通灯的顺序，而不是在按下按钮时改变。这是我目前的代码： <!DOCTYPE html> <html> <body> <img id="light" src="X:/A452/Traffic lights/Assets/traffic-lights-green.jpg"> <button onclick=Green() id="button"> Change!</button> <

我试图用3秒钟的定时器来自动控制交通灯的顺序，而不是在按下按钮时改变。这是我目前的代码：

<!DOCTYPE html>
<html>

<body>

<img id="light" src="X:/A452/Traffic lights/Assets/traffic-lights-green.jpg">

<button onclick=Green() id="button">
Change!</button>

</body>

<script>

var Green = function() {
    document.getElementById('light').src='X:/A452/Traffic lights/Assets/traffic-lights-green.jpg';
    document.getElementById( "button" ).setAttribute( "onClick", "javascript: Amber();" );
}

var Amber = function() {
    document.getElementById('light').src='X:/A452/Traffic lights/Assets/traffic-lights-amber.jpg';
    document.getElementById( "button" ).setAttribute( "onClick", "javascript: Red();" );
}

var Red = function() {
    document.getElementById('light').src='X:/A452/Traffic lights/Assets/traffic-light-red.jpg';
    document.getElementById( "button" ).setAttribute( "onClick", "javascript: AmberTwo();" );
}

var AmberTwo = function() {
    document.getElementById('light').src='X:/A452/Traffic lights/Assets/traffic-lights-amber.jpg';
    document.getElementById( "button" ).setAttribute( "onClick", "javascript: Green();" );
}

</script>

</html>


改变
var Green=函数（）{
document.getElementById（'light'）.src='X:/A452/Traffic lights/Assets/Traffic lights green.jpg'；
document.getElementById（“按钮”）.setAttribute（“onClick”，“javascript:Amber（）；”）；
}
var Amber=函数（）{
document.getElementById（'light'）.src='X:/A452/Traffic lights/Assets/Traffic lights amber.jpg'；
document.getElementById（“按钮”）.setAttribute（“onClick”，“javascript:Red（）；”）；
}
var Red=函数（）{
document.getElementById（'light'）.src='X:/A452/Traffic lights/Assets/Traffic light red.jpg'；
document.getElementById（“按钮”）.setAttribute（“onClick”，“javascript:AmberTwo（）；”）；
}
var AmberTwo=函数（）{
document.getElementById（'light'）.src='X:/A452/Traffic lights/Assets/Traffic lights amber.jpg'；
document.getElementById（“按钮”）.setAttribute（“onClick”，“javascript:Green（）；”）；
}

我不知道如何设置图片更改的计时器，以及如何激活代码中已指定的不同功能。

提前谢谢

告诉我们有关您的问题的更多信息

不要通过设置“onClick”属性来附加事件处理程序，不要将其附加到javascript:schemed URL（仅href属性需要此URL）

document.getElementById（“按钮”）.onclick=Green更干净

其次，您的服务器不知道什么是“X:/”
，因为它可能是映射的网络驱动器或本地驱动器
@Mike McCaughan
请格式化您的代码并列出您在代码中遇到的问题，以便我们提供帮助。您的问题是什么？他希望自动更改颜色。似乎样式应该定义为CSS类。另外，你的换灯功能在哪里？@maniak1982它就在按钮的onClick事件中