jQuery Slider的用戶控件不起作用

Question

所以我開始學習jQuery，並且我決定製作一個簡單的滑塊。 一切工作正常，直到我到達用戶控件的部分（prev/next img）。

有人能告訴我我在哪裏做錯了。

<div id="slider"> 

    <div id="slideshow"> 
     <img id="1" src="http://i.imgur.com/bWsaWvN.jpg" border="0" alt="First Slide"> 
     <img id="2" src="http://i.imgur.com/nhxEbVm.jpg" alt="Second Slide"> 
     <img id="3"src="http://i.imgur.com/OU3hY91.jpg" alt="Third Slide"> 
    </div> 

    <img id="prev" onclick="prev()" src="http://i.imgur.com/v7KjugK.png" alt=""> 
    <img id="next" onclick="next()" src="http://i.imgur.com/xja1vLW.png" alt=""> 

</div> 

以下是完整的滑塊：

http://codepen.io/Chrez/pen/EVWdqe

Answer 1

只是這些替代你next()和prev()功能：

$("#prev").click(function() { 

    newSlide = sliderInt - 1; 
    showSlide(newSlide); 

}); 

$("#next").click(function() { 

    newSlide = sliderInt + 1; 
    showSlide(newSlide); 

}); 

Demo : Fiddle

Answer 2

你可以使用addEventListener方法，而不是onclick屬性的http://codepen.io/anon/pen/wKJQMo

var btnPrev = document.getElementById('prev'); 
var btnNext = document.getElementById('next'); 
btnPrev.addEventListener('click', function(){ 
    newSlide = sliderInt - 1; 
    showSlide(newSlide); 
}); 
btnNext.addEventListener('click', function(){ 
    newSlide = sliderInt + 1; 
    showSlide(newSlide); 
}); 

Answer 3

$(document).ready(function() { 
 
    $("#slideshow > img#1").fadeIn(300); 
 
    startSlider(); 
 

 

 
    $("#prev").click(function next() { 
 
     newSlide = sliderInt - 1; 
 
     showSlide(newSlide); 
 
    }); 
 

 
    $("#next").click(function next() { 
 
     newSlide = sliderInt + 1; 
 
     showSlide(newSlide); 
 
    }); 
 

 

 
    });