Javascript圖像切換序列

作爲一項任務，我將在按下按鈕時使交通燈順序改變。我將通過使用變量並在每次顯示圖像時向其添加一個來做到這一點，因此計算機通過使用if和elses知道下一個要顯示的圖像，但是我不擅長JavaScript，它不會運行我已經在許多不同的環境中嘗試過，例如在Dreamweaver和記事本++中，但是不會在這裏是我所擁有的得到：Javascript圖像切換序列

<HTML> 
<head> 
    <title>Untitled Document</title> 
</head> 


<body> 
    <img id="IMAGE" width="100" height="200"></img> 
    <button onClick="imageswap(a)">GO</button> 
</body> 

<script> 
    var a = 0 
    function imageswap(a) 
    { 
     if (var a==0) { 
     document.getElementById('IMAGE').src='red_empty_empty.png'; 
     var a + 1; 
    } 
    else if (a==1) 
    { 
     document.getElementById('IMAGE').src='empty_amber_empty.png'; 
     var a + 1; 
    } 
    else 
    { 
     document.getElementById('IMAGE').src='empty_empty_red.png'; 
     var a==0; 
    } 
} 
</script> 
</html>

謝謝你的閱讀，我會很感激任何人的幫助。

編輯：我已經採取了反饋意見，並修改了我的代碼，但是當測試它不顯示圖像我想代替小x。

<HTML> 
<head> 
    <title>JAVASCRIPT</title> 
</head> 


<body> 
    <img id="IMAGE" width="100" height="200"></img> 
    <button onClick="imageswap()">GO</button> 
</body> 

<script> 
    var a = 0 
    function imageswap() 
    { 
     if (a=0) { 
     document.getElementById('IMAGE').src='red_empty_empty.gif'; 
     a = a + 1; 
    } 
    else if (a==1) 
    { 
     document.getElementById('IMAGE').src='empty_amber_empty.gif'; 
     a = a + 1; 
    } 
    else 
    { 
     document.getElementById('IMAGE').src='empty_empty_red.gif'; 
     var a=0; 
    } 
} 
</script> 
</html>

編輯：我已考慮到了一些建議，現在當我點擊按鈕第一圖像示隨後在第二次按下按鈕第二然而它未能顯示第三圖像和所述第一和第二個圖像不總是第一次工作。

<HTML> 
<head> 
    <title>JAVASCRIPT</title> 
</head> 


<body> 
    <img id="IMAGE" width="100" height="200"></img> 
    <button onClick="imageswap()">GO</button> 
</body> 


<script> 
var a = 0; 

function imageswap() { 
    if (a == 0) { 
    document.getElementById('IMAGE').src = 'red_empty_empty.gif'; 
    a += 1; 
    } else if (a == 1) { 
    document.getElementById('IMAGE').src = 'empty_amber_empty.gif'; 
    a += 1; 
    } else { 
    document.getElementById('IMAGE').src = 'red_empty_empty.gif'; 
    a = 0; 
    } 
} 
</script>

來源

2016-11-04 benisbestpokemongo

你有幾個語法錯誤。使用[JSHint]（http://jshint.com/）找到它們。 – Xufox

在第3行jshint給了我錯誤「預期的標識符，而是看到'var'。」但我不明白如何解決這個問題，請解釋一下？ – benisbestpokemongo

我在console.log(a)應用。它會顯示a \

增值應用var a在globel將你每次上增加點擊

，並增加與a +=1，而不是應用a+1

var a = 0 
 
console.log(a) 
 
function imageswap(){ 
 
if (a==0) { 
 
document.getElementById('IMAGE').src='red_empty_empty.png'; 
 
a += 1; 
 
    console.log(a) 
 
} else if (a==1){ 
 
document.getElementById('IMAGE').src='empty_amber_empty.png'; 
 
a += 1; 
 
    console.log(a) 
 
} else { 
 
document.getElementById('IMAGE').src='empty_empty_red.png'; 
 
a =0; 
 
    console.log(a) 
 
} 
 

 
}

<button onclick="imageswap()">GO</button><br> 
 
<img id="IMAGE" width="100" height="200"></img>

來源

2016-11-04 16:54:09 prasanth

好吧，說我刪除從括號內的a如何獲得代碼然後工作？（考慮到我已經添加了缺少的分號） – benisbestpokemongo

哪一個括號？你能解釋一下嗎？請參閱我不應用任何值在括號內'imageswap（）' – prasanth

是的多數民衆贊成在我的意思是什麼都沒有在功能圖像交換髮生任何事情 – benisbestpokemongo

你

var a = 0你宣佈你的計數器（在var a部分），並通過將值0（a = 0 part）初始化它第一線，因此沒有必要稍後再次聲明變量，你只是想將其更新分配新值

這樣的聲明if (var a==0)是不正確的語法，因爲你不能檢查，如果一個變量聲明爲0，你當然可以檢查的，如果上面定義的變量具有的值爲0，這將是if (a==0)

當您嘗試增加co時也是如此價值不菲。 var a + 1;是錯誤的，因爲你不能遞增1個聲明。你應該將分配給現有的櫃檯，本身的值加1，所以a = a + 1;

最後，當您嘗試重置計數器，var a==0;，（通常聲明錯誤旁）記得==是比較=是分配。您不應該檢查計數器是否爲0，您應該將值0賦予計數器以重置計數器。

希望它有助於

來源

2016-11-04 16:55:29 alebianco

好一些事情你需要照顧：

您的功能imageswap(a)內傳遞，你是從那將是在函數中傳遞的值訪問a0一直。檢查https://jsfiddle.net/aegwj88g/
您正在檢查var a==0，var a==1這是不正確的。它應該像if(a==0)或else if(a==1)。
您正試圖將值分配給var a + 1，這也是錯誤的。左手邊必須是一個有效的變量，而不是javascript令牌（檢查JS naming convention），它存儲該值。它應該是a=a+1（或a+=1），就像你在數學中一樣;

入住此fiddle：

來源

2016-11-04 17:04:46

Javascript圖像切換序列

回答

相關問題