jQuery的週期訪問數據，並追加到div的

Question

我工作了一個稍微騙出jQuery的週期在我的網站，我需要從特定的幻燈片加載data到不同的div它坐落於實際滑塊的頂部，所以每次我打了下一次/後退它會加載正確的數據 - 我的問題是在回調我如何設置指數，使其與在我的數組正確的數據？我想，真正的問題是關於一個數組，而不是循環訪問數據。

var array = [ 
     { 
      url: 'slide01.jpg', 
      data : 'Eat, <br /> Drink, <br /> Escape!' 
     },  
     { 
      url: 'slide02.jpg', 
      data : 'Eat, <br /> Drink, <br /> Escape!2' 
     }, 
     { 
      url: 'slide03.jpg', 
      data : 'Eat, <br /> Drink, <br /> Escape!3' 
     }, 
     { 
      url: 'slide04.jpg', 
      data : 'Eat, <br /> Drink, <br /> Escape!4' 
     }, 
     { 
      url: 'slide05.jpg', 
      data : 'Eat, <br /> Drink, <br /> Escape!5' 
     }       
    ]; 

    var path = 'img/'; 

     $.each(array, function(i) { 
      $('#slider').append('<li data-id="' + i + '"><img src=' + path + array[i].url + '></li>'); 
     }); 

     $('#slider').cycle({ 
     fx: "scrollHorz", 
     next: "#next", 
     prev: "#prev", 
     speed: 1000, 
     timeout: 5000, 
     before: onBefore(), 
     after: onAfter(), 
     cssBefore: { 
      opacity: 0 
     }, 
     animIn: { 
      opacity: 1 
     }, 
     animOut: { 
      opacity: 0 
     }, 
     cssAfter: { 
      opacity: 1 
     }, 
     delay: 3000 
     }); 
     function onBefore() { 
     $('#content').html("Scrolling image:<br>" + this.src); 
     } 
     function onAfter() { 
     $('#content').empty().append('<h1>' + array[i].data + '</h1>'); 
     }  

Answer 1

事件後具有以下參數http://jquery.malsup.com/cycle/options.html：

function(currSlideElement, nextSlideElement, options, forwardFlag)

所以，你可以這樣做數組[options.currSlide]該事件中..

function onAfter(currSlideElement, nextSlideElement, options, forwardFlag) { 
     $('#content').empty().append('<h1>' + array[options.currSlide].data + '</h1>'); 
    }