點擊顯示下一個數組項目

Question

我試圖編寫一個點擊函數來顯示jquery中的點擊函數上的下一個數組項，但它沒有工作。請指點:)

var array = [one, two, three, four, five]; 
 
    
 
    $('#countButton').click(function(){ 
 
     for(var i = 0; i < array.length; i++){ 
 
     $('#displayCount').html(array[i++]);   
 
     }  
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 

 

 
<input type="button" value="Count" id="countButton" /> 
 
<p>The button was pressed <span id="displayCount">0</span> times.</p>

Answer 1

沒有必要在這裏使用一個循環。單擊後訪問陣列中的下一個元素：

var array = ['one', 'two', 'three', 'four', 'five']; 
    var count = 0; 
    $('#countButton').click(function(){ 
    if(count <= array.length){ 
     count++; 
    } else{ 
     count = 0 
    } 
    $('#displayCount').html(array[count]);     
    }); 

Answer 2

您不需要循環它。只是有一個全局變量使用相同的增量方法

var array = ['one', 'two', 'three', 'four', 'five']; 
 
var i = 0; 
 
$('#countButton').click(function() { 
 
    $('#displayCount').html(array[i++%5]); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 

 

 
<input type="button" value="Count" id="countButton" /> 
 
<p>The button was pressed <span id="displayCount">0</span> times.</p>