交通燈序列

-1

我正在幫助我的「幫助我的5歲兒子交通燈序列」（因爲它如此雄辯），我檢查了多個來源，我只是無法弄清楚爲什麼我的代碼不起作用。交通燈序列

這就是：

</body> 
<!DOCTYPE html> 
<html> 

<body> 

<img id="light" src="Red.png"> 

<script> 
var list= ['Green.png', 'Yellow.png', 'Red.png']; 
var i = 0; 
function lightsCycle() { 
    i = i + 1; 
    i = i % arr.length; 
    if (i == list.length) i = 0; 
    return arr[i]; 
    var image = document.getElementById(element).src = list[i].src;; 
      light.src=list[i]; 
</script> 

<button type = "button" onclick="lightCycle()">Next Light</button> 

</html>

來源

2016-11-18 EndOf

定義「不起作用」 –

您的結束''標籤怎麼了？ –

'lightCycle' vs'lightsCycle' –

錯誤

你結束body標籤放錯了地方
你有一個lightsCycle功能，但您呼叫lightCycle()（失蹤小號）
你爲得到的功能
您正在使用的變量arr結束的支架不存在
你在你的代碼的中間有一個return arr[i];聲明。下一行代碼將不會執行

請參閱以下代碼以獲得一個簡單示例。我替換顏色

形象，讓您的代碼與圖片做到以下幾點：

由路徑替換顏色到您的圖像

更換<span>通過<img>

更換document.getElementById("light").style.color = nextColor;通過document.getElementById("light").src = nextColor;

var list = ['green', 'yellow', 'red']; 
 
var index = 2; 
 

 
function lightsCycle() { 
 
    document.getElementById("light").style.color = list[++index % list.length];; 
 
}

<span id="light" style="color: red">●</span> 
 
<button type="button" onclick="lightsCycle()">Next Light</button>

來源

2016-11-18 10:34:28 Weedoze

i = i % arr.length;

應該i % list.length;

var image = document.getElementById(element).src = list[i].src;;

應該var light = document.getElementById("light").src=list[i];

onclick="lightCycle()"

應該onclick="lightsCycle()" 你需要身體標籤上的按鈕後。不需要模態的if語句。 light.src=list[i];是重複的。而你需要一個功能的右括號。返回將停止src改變。

<!DOCTYPE html> 
 
<html> 
 

 
<body> 
 

 
<img id="light" src="Red.png"> 
 

 
<script> 
 
var list= ['Green.png', 'Yellow.png', 'Red.png']; 
 
var i = 0; 
 
function lightsCycle() { 
 
    i = i + 1; 
 
    i = i % list.length; 
 
    var light = document.getElementById("light").src = list[i]; 
 
} 
 
</script> 
 

 
<button type = "button" onclick="lightsCycle()">Next Light</button> 
 
</body> 
 
</html>

這裏是一個工作版本，很多固定的錯誤。

來源

2016-11-18 10:36:56 pteronewone

回答

相關問題