交通燈序列Javascript

-2

我被要求做出一個交通燈序列，但我不知道我的工作中的錯誤是什麼。當我點擊按鈕時，沒有圖像會切換，我不太確定我做錯了什麼。它只停留在默認的交通燈圖像上。該代碼是：交通燈序列Javascript

<!DOCTYPE html> 
<html> 
<body> 

<h1> <u> T</u></h1> 

<img id="Lights" src="TrafficLights.png" alt="Traffic Lights" width="600" height ="500"> 

<button onclick="ChangeLights()">Switch lights</button> 

<script> 
var TrafficLights = new array(); 
var TrafficLights = ["TrafficLights.png", "RedLights.png", "YellowLights.png", "GreenLights.png"] 
var index = 0; 
    function ChangeLights() { 
     index = index + 1; 
     if (index == TrafficLights.length) 
      index = 0; 
    document.getElementById("Lights").src = TrafficLights[index]; 
    } 

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

來源

2017-05-04 cloud007

您不需要定義'var TrafficLights' * *兩次*。 'new array（）;'不是有效的JavaScript代碼。 –

你不知道你工作中的錯誤是什麼？打開開發人員控制檯並查看這是拋出的錯誤。一點點的努力都有很長的路要走！ –

你是否收到任何錯誤訊息？您是否嘗試在您的ChangeLights函數中放置console.log語句，以查看單擊該按鈕時是否調用它？ –

var TrafficLights = new array();

此行是造成所有的錯誤。刪除它，一切都應該工作。

你，因爲下一行是不需要這行：

var TrafficLights = ["TrafficLights.png", "RedLights.png", "YellowLights.png", "GreenLights.png"]

此聲明並定義TrafficLights是一個數組，就沒有必要對前行。

注意：如果要製作空白陣列，請執行var TrafficLights = [];（首選）或var TrafficLights = new Array;（注意大寫'A'）。

來源

2017-05-04 15:59:41

Thankyou :)但是即使在刪除此行後，仍然因某種原因無法工作。 – cloud007

它適用於我：https://jsfiddle.net/z5jy8nph/打開JavaScript控制檯，看看是否有任何錯誤。 –

我不確定發生了什麼事，但我重新打開並重新生成了.html文件，並立即刪除該行，現在它可以正常工作。謝謝！在我重新打開它之前，它肯定出了問題 – cloud007

這是一個有趣的。因此，有與分配new array()分配一個例外，因爲array是不是一個有效的東西，如在以前的答案：

var TrafficLights = new array(); 
VM276:1 Uncaught ReferenceError: array is not defined 
    at <anonymous>:1:25

人們會認爲這個錯誤下面的代碼並沒有得到評估...

...但是，單擊該按鈕實際上調用ChangeLights功能正常，這產生了不同的錯誤：

VM81:66 Uncaught TypeError: Cannot read property 'length' of undefined 
at ChangeLights (VM81:66) 
at HTMLButtonElement.onclick (VM83:56)

所以ChangeLights函數被聲明，而TrafficLights沒有。這是爲什麼？

我想這是因爲TrafficLights變量永遠不會因爲第一個錯誤的聲明，但該功能有效，因爲它是hoisted之前，首先異常甚至拋出！

來源

2017-05-04 16:05:31 lxe

交通燈序列Javascript

回答

相關問題