Slideshow功能在Javascript中不起作用

Question

我正在嘗試爲幻燈片寫一個動態代碼。我已經多次看過它，我認爲一切都是正確的，但它不起作用。我找不到我有錯誤的地方。我希望每個人都可以告訴我什麼是錯的：

<button type="button" id="back">&lt;&lt;</button> 

<button type="button" id="forward">&gt;&gt;</button> 

<img id="photo" src="http://photo.interpressnews.ge/img/image1/b37065d8bf0bd9e25d5bcb3c144b0269.jpg" width="200 height="200> 

和Javascript：

var photos = new Array("http://photo.interpressnews.ge/img/image1/b37065d8bf0bd9e25d5bcb3c144b0269.jpg", "http://photo.interpressnews.ge/img/image1/c81dae9175d056aa243a5a0e56b3c111.jpg", "http://photo.interpressnews.ge/img/image1/5ff96384ddf214ef33706ffdb922b710.jpg"); 
var imgnumber = 0; 
var imgleng = photos.length - 1; 
var img = document.getElementById("photo"); 
var current = photos.indexOf(img.src); 
var nextindex; 
var back = document.getElementById("back"); 
var forward = document.getElementById("forward"); 
back.addEventListener('click', toggleImage('back')); 
forward.addEventListener('click', toggleImage('forward')); 

function toggleImage(direction) { 
    if(direction == 'forward'){ 
    nextindex = current != photos.length - 1 ? current + 1 : 0; 
    } else { 

    nextindex = current != 0 ? current - 1 : photos.length - 1; 
    } 
    img.src = photos[nextindex]; 
} 

Answer 1

問題與onclick事件做。您正在調用該函數，而不是將其綁定到事件偵聽器。帶參數'back'或'forward'的函數調用必須在函數內。這裏是更正的代碼：

var photos = new Array("http://photo.interpressnews.ge/img/image1/b37065d8bf0bd9e25d5bcb3c144b0269.jpg", "http://photo.interpressnews.ge/img/image1/c81dae9175d056aa243a5a0e56b3c111.jpg", "http://photo.interpressnews.ge/img/image1/5ff96384ddf214ef33706ffdb922b710.jpg"); 
    var imgnumber = 0; 
    var imgleng = photos.length - 1; 
    var img = document.getElementById("photo"); 
    var current = photos.indexOf(img.src); 
    var nextindex; 
    var back = document.getElementById("back"); 
    var forward = document.getElementById("forward"); 
    back.addEventListener('click', function(){toggleImage('back')}); 
    forward.addEventListener('click', function(){toggleImage('forward')}); 

    function toggleImage(direction) { 
     if(direction == 'forward'){ 
     current = current != photos.length - 1 ? current + 1 : 0; 
     } else { 
     current = current != 0 ? current - 1 : photos.length - 1; 
     } 
     img.src = photos[current]; 
    }