单击时显示下一个数组项

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>